Cara Membuat Recent Posts Otomatis With Thumbnail

Selamat malam sobat Caritahu.com. Malam ini Caritahu.com akan berbagi informasi mengenai Cara Membuat Recent Posts Otomatis With Thumbnail. Untuk dapat Membuat Recent Post Otomatis With Thumbnail, ikuti cara-cara di bawah ini :

Membuat recent post bergerak
Membuat recent posts otomatis with thumbnail
1. Login ke akun Blogger sobat.

2. Pilih Tata Letak dan Tambahkan Gadget (Add Gadget), setelah itu klik HTML/Javascript dan copy kode berikut di dalamnya.

 <style>
img.recent_thumb {padding:1px;width:55px;height:55px;border:0;
float:right;margin:0 0 5px 10px;}
.recent_posts_with_thumbs
{float: left;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://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script style='text/javascript' src="http://code.helperblogger.com/hb-jquery-ticker.js" ></script> <script style='text/javascript' src='http://code.helperblogger.com/hb-recentposts.js'></script> <script style='text/javascript'> 
var numposts = 7;
var showpostthumbnails = true
var displaymore = false; 
var displayseparator = false; 
var showcommentnum = false; 
var showpostdate = false;
var showpostsummary = true; 
var numchars = 100; $(document)
.ready(function () {$('#sai').vTicker({ speed: 500, pause: 3000, showItems: 3, animation: 'fade', mousePause: false, height: 0, direction: 'up' });}); 
</script>
 <div id="sai">
 <script src='http://www.yourblog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'>
</script> 
</div> 

3. Ganti kode berwarna Biru dengan jumlah postingan, ganti kode true warna Pink dengan false bila sobat ingin Recent Post tanpa thumbnail, dan juga www.yourblog.blogspot.com dengan URL blog sobat.

4. Setelah itu klik Simpan Template dan lihat hasilnya di sidebar blog.

Baca juga :
12 Tanda Cowok Jatuh Cinta Pada Cewek
10 Film Animasi Karya Anak Bangsa
15 Situs Download Ebook Gratis
Trick Diving PES 2013

                                                                      * * * * * * * *

Sumber kode : Helperblogger

4 komentar

wah keren nih makasih ya sharenya
Koment balik ya
http://justshare4rt.blogspot.com

Oke gan. salam kenal. semga bermanfaat.

Keren sob artikelnya sangat bermanfaat. Terimakasih akan saya coba langsung di blog saya perawatanwajah.co.id

terimakasih informasinya :)
http://goo.gl/4jDhC3

Silahkan berkomentar. No SARA !!!

Bila tertarik untuk melakukan re-post artikel ini, silahkan sertakan sumber link artikel ini. Terima Kasih.

EmoticonEmoticon