Cara membuat tampilan Postingan terbaru bergerak kebawah

Oleh Unknown

27/01/2015

Bagikan :

Tweet

Recent post atau dalam bahasa kita adalah Postingan Terkini / terbaru dengan widget yang bisa sobat pasang di blog dengan tujuan memberikan informasi tentang postingan atau artikel terkini.

Recent post biasanya menampilkan sejumlah judul artikel yang belum lama sobat posting dalam deretan ke bawah. Contohnya sobat bisa lihat di sidebar blog ini. Berikut caranya:

• Log in ke akun blog sobat.
• Pilih tata letak (sesuaikan letak susuka sobat) >> Tambah gadget >> pilih HTML/Javascript.

Masukkan kode berikut ke dalam konten:

1. <style type="text/css">
2. #rp_plus_img{height:377px;}
3. #rp_plus_img li {height:60px;padding:5px;list-style:none;
4. background-color:#ffffff;
5. border:solid 1px #000000;}
6. #rp_plus_img a{color:#00000;}
7. #rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
8. text-align:justify;
9. -moz-border-radius: 5px;}
10. #rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
11. </style>
12. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
13. </script>
14. <script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">
15. </script>
16. <script type="text/javascript">
17. var speed = 1500;
18. var pause = 3500;
19. $(document).ready(function(){
20. rpnewsticker();
21. interval = setInterval(rpnewsticker, pause);
22. });
23. </script>
24. <ul id="rp_plus_img"><script>
25. var numposts = 5;
26. var numchars = 0;
27. </script> <script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
28. </script>     </ul>
29. <small><a href="http://hohonugroho07.blogspot.com/2015/01/cara-membuat-tampilan-postingan-terbaru.html" target="_blank">get this widget here</a></small>

Simpan setelan,  lihat deh  hasilnya.

Note : Nomornya(1-29), jangan ikut di copi yah , !!

Thanks for : tatelu. 

Tag : Tips Bloging