Membuat Recent Post Berdasarkan Kategori

Berikut ini Bangiz mau berbagi cara untuk mempercantik tampilan blog Anda, Sesuai judul di atas yaitu Widget Artikel Berdasarkan Label. Tutorial blogging sebelumnya Bangiz pernah membahas tentang Membuat Random Post hanya Thumbnail dan juga Membuat Recent Post hanya Thumbnail, kalau mau tahu tutorialnya silahkan klik saja linknya. Widget Recent Post berdasarkan kategori atau label ini cocok untuk ditampilkan di sidebar, footer, bawah postingan, atau di homepage apabila Anda menggunakan template News. Untuk contohnya silahkan lihat gambar di bawah ini.

Apabila Anda tertarik untuk menggunakannya, langsung ikuti saja tutorialnya berikut ini:

1. Silahkan masuk ke Dasbor Blogger.

2. Pilih Tata Letak > Tambahkan Gadget > Cari HTML/Javascript.

3. Copy-paste kode berikut pada kolom konten yang tersedia, jangan lupa beri judul widgetnya.

<style>
img.recent_thumb {padding:1px;width:55px;height:55px;border:0; float:left;margin:0 0 5px 10px;}.recent_posts_with_thumbs {float: right;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;}.recent_posts_with_thumbs a {text-decoration:none;}.recent_posts_with_thumbs strong {font-size:10px;} </style><script src="http://id-pemula-javascript.googlecode.com/files/recent-post-label-thumbnail.js">
</script><script>
var numposts = 6;var showpostthumbnails = true;var displaymore = true;var displayseparator = true;var showcommentnum = true;var showpostdate = true;var showpostsummary = true;var numchars = 100;
</script><script src="http://downloadwallpaperanimasi.blogspot.com//feeds/posts/default/-/Widget?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs">
</script> 

Sumber kode: id-pemula.blogspot.com 

4. Klik Simpan dan lihat hasilnya di blog Anda.

Keterangan kode pada nomor 3:

Angka 12 adalah ukuran font untuk judul postingan

Angka 6 merupakan jumlah postingan yang ditampilkan

Angka 100 adalah jumlah karekter huruf pada deskripsi postingan

Bangiz.blogspot.com adalah link tujuan, silahkan ganti dengan url blog Anda

Widget, silahkan ganti dengan label atau kategori yang akan ditampilkan. Apabila labelnya memiliki 2 kata maka ganti spasinya dengan kode %20

Untuk pengaturan lainnya silahkan sesuikan dengan keinginan Anda