Cara Membuat Recent Post Thumbnail with Slider

Tutorial kali ini kita akan membuat recent post / new entri dengan  thumbnail, sebenarnya di dalam addons blogger sendiri sudah tersedia. yang anda lakukan hanya masuk ke Rancangan lalu tambah  widget >> recent post..done.
Namun kali ini tampilannya sedikit berbeda, untuk samplenya anda bisa lihat disini, jika anda menyukainya silahkan ikuti tutorialnya..

Anda masuk ke dasbor --> rancangan --> lalu tambah widget --> pilih HTML / javascript
lalu masukan kode berikut :   

1 <div class="eggTray"><script src="http://javakoe.googlecode.com/files/listbadge.js">
2 {"pipe_id":"1a6640e2a78b2c6e736f2220529daae5","_btype":"list",
3    "pipe_params":{"URL":"http://YourOwnB1og.blogspot.com/feeds/posts/default"},
4   "hideHeader":"false","height":"500","count": 8 }
5 </script>
6
7 <div class="ycdr" style="font-family: arial, sans-serif; font-size: 9px;"><a href="http://goo-dude.blogspot.com/2011/07/cara-membuat-recent-post-with-thumbnail.html" target="_blank" title="Grab this widget">Recent Posts Thumbnails</a> <a href="http://goo-dude.blogspot.com/" target="_blank">Blogger Widget</a></div><noscript>Your browser does not support JavaScript!</noscript></div><style type="text/css">
8   .eggTray {margin:10px 0px;padding:0px;}
9   .ybr li  {border-bottom:0px #cccccc dotted; padding:0px 0px 10px 0px!important;}
10    .ycdr {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy3XsIw7Rf9eNoGsIIu3zKnVXTbnIpKJ9iFM7KnT3QqaBI8PKE9G7q8HVafCjusJbbA82RRLPP4Am_UJsFr8eXTeYyHkRk5zKwyyGFz0lMk-K1m3gXVb9Ws1Xk7p1i2SRrJr6jg3dgP2BD/s400/blgo.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 4px 0px 0px 0px;line-height:14px;}
11    .ycdr, .ycdr a {color:#999999;}
12    .widget .popular-posts ul {padding-left:0;}
13  </style>

Silahkan Cari Kode Ini:

{"URL":"http://YourOwnB1og.blogspot.com/feeds/posts/default"}

Lalu ganti dengan alamat blog Anda..lalu save.

Selamat mencoba...