Cara Membuat Recent Post dengan Thumbnail

Assalamualaikum..

Jika dulu saya pernah membahas tentang cara membuat recent post yang tanpa thumbnail.. kali ini saya akan share topik yang sama, tetapi disertai dengan thumbnail. Mungkin fungsinya sama, tetapi recent post dengan thumbnail bisa memiliki nilai + pada tampilan, namun memiliki nilai - dalam kecepatan loading blog. Keputusan  untuk menggunakan yang tanpa atau dengan thumbnail merupakan pilihan kita masing - masing.

Caranya :

• Masuk ke dashboard
• Klik design
• Pada page elements klik add a gadget
• Pilih HTML/Javascript
• Pada content masukkan kode berikut ini :

<style> img.recent_thumb {padding-right:5px;padding-left:padding-bottom:0px;0px;width:55px;height:40px;border:0;float:left;margin:0 0 5px 0px;} .recent_posts_with_thumbs {float: left;width: 100%;min-height: 50px;margin: 0px 0px 5px 0px;padding: 0;font-size:15px;font-color:black;font-family:calibri;} ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;padding-left:0px;padding-right:20px;min-height:50px;list-style:normal;} .recent_posts_with_thumbs a {text-decoration:none;} .recent_posts_with_thumbs normal {font-size:13px;} </style> <script style="text/javascript" src="http://bloggerplugins.org/scripts/recentpostswiththumbs.js"></script> <script style="text/javascript"> var numposts = 8; var showpostthumbnails = true; var displaymore = false; var displayseparator = false; var showcommentnum = false; var showpostdate = false; var showpostsummary = false; var numchars = 75; </script> <script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"></script>
• Klik save..
• Selesai..

Bagaimana ? Sudah ada terpampang bukan post - post terbaru teman ? :)

Regards,

Irfan

Berlangganan Artikel Referensi Kita

Tweet

Masukkan alamat email Anda:

Related Post: