Cara Membuat Recent Post dengan Thumbnail di Blogspot

Cara Membuat Recent Post dengan Thumbnail di Blogspot – Untuk membuat tampilan blog anda lebih menarik, kali ini blogoonline ingin membagikan cara membuat recent post dengan thumbnail setelah posting beberapa waktu lalu membahas cara membuat recent post tanpa thumbnail. Menggunakan thumbnail dapat membuat tampilan widget anda menarik karena disertakan gambar, sehingga pengunjung akan tertarik jika gambar yang anda pasang bisa memprovokasi pengunjung dalam arti positif, untuk mengklik.

Cara ini hasilnya akan seperti jika anda menggunakan Popular Post bawaan asli blogger. Cukup menarik bukan? Baik langsung saja berikut ini cara membuat recent post dengan thumbnail di blogspot :

1.  Login ke akun blogger anda
2.  Pilih Layout
3.  Klik Add Widget
4.  Pilih HTML/ Javascript
5.  Masukkan kode dibawah ini

<style type='text/css'>
img.recent_thumb {padding:1px;width:72px;height:72px;border:0;
float:left;margin: 10px 10px 5px 0px;}
.recent_posts_with_thumbs {float: left;width: 100%;margin: 10px 10px 5px 0px;padding: 0;font-size:13px;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;}
.recent_posts_with_thumbs strong {font-size:12px;}</style>
<script style='text/javascript' src='http://recent-post-techkgp.googlecode.com/files/recent%20post_www.techkgp.com.js'></script>
<script style='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 150; </script>
<script src='http://blogoonline.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>

Ganti jumlah posting yang akan tampil dan ubah juga alamat url tersebut dengan alamat url milik anda. Kode ini telah dicoba dan berhasil, seperti terlihat pada gambar.

6.  Simpan

Demikian artikel tentang cara membuat recent post dengan thumbnail di blogspot, semoga bermanfaat.