Cara Membuat Blog Cantik dengan Recent Post With Thumbnail Bergerak

Assalamu'alaikum sobat blogger semua,and selamat menunaikan ibadah puasa.Setelah beberapa minggu kang Roni absen karena disibukkan oleh kegiatan yang beruntun ditambah lagi monitor rusak jadi baru kali ini kang Roni bisa mulai lagi untuk membuat postingan.Sebelumnya kang Eko  sudah memposting beberapa tips tutorial penting untuk mempercantik blog .Dan kali ini kang Roni akan memberikan tips untuk mempercantik blog dengan membuat Recent Post With Thumbnail Bergerak,untuk sobat yang ingin membuatnya ikuti saja langkah langkahnya dibawah ini.

1.Seperti biasa Login Blogger.com
2.Klik Rancangan-->Tambah Gadget/Add Gadget ditempat yang sobat inginkan,kemudian pilih HTML/JavaScript.
3.Selanjutnya sobat copy kode dibawah ini lalu masukkan kedalam kotak HTML/JavaScript tadi.

<center><style type="text/css">

#rp_plus_img{height:300px;overflow:hidden;border:solid 0px #fff;padding:6px 10px 24px 5px;background-color:transparent;}

#rp_plus_img ul{list-style-type:none;margin:0;padding:0}

#rp_plus_img li{border:1px; margin:0; padding:0; list-style:none;}

#rp_plus_img li{height:60px;padding:5px;list-style:none;}

#rp_plus_img a{color:#F68629;}

#rp_plus_img .news-title{display:block;font-size:14px;font-weight:bold !important;color:#F68629;text-align:justify;}

#rp_plus_img .news-text{display:block;font-size:11px;font-weight:normal !important;color:#000000;text-align:justify;}

#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #F68629;width:95px;height:55px;}

</style>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">

</script>

<script src="http://theplick.googlecode.com/files/newsticker-plick.js" type="text/javascript">

</script>

<script type="text/javascript">

var speed = 1000;

var pause = 2500;

$(document).ready(function(){

rpnewsticker();

interval = setInterval(rpnewsticker, pause);

});

</script>

<ul id="rp_plus_img"><script>

var numposts = 20;

var numchars = 45;

</script> <script src="http://www.eko-tipsntrick.co.cc/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">

</script> </ul>

</center>

Perhatikan tulisan warna pink ubahlah dengan link blog milik sobat,dan warna biru untuk mengatur tinggi recent postnya,setelah selesai mengedit jangan lupa untuk menyimpannya.

Untuk menghasilkan tampilan yang sesuai dengan template,sobat otak atik saja kode recent post diatas,jangan kawatir atas kesalahan edit karena kode ini tidak masuk dalam template,dan dengan mengotak atik pastinya akan menambah banyak ilmu,oke langsung aja sobat praktekkan Cara Membuat Blog Cantik dengan Recent Post With Thumbnail Bergerak.