Cara membuat recent post dengan thumbnail bergerak di blog

Kali ini kita akan membahas tentangcara membuat recent post-artikel terbaru di blog.Dengan kita memasang recent post atau postingan terbaru di sidebar blog,maka para pengunjung akan lebih mudah mengetahui postingan terbaru sobat.Recent post yang akan kita buat ini adalah recents post thumbnail yang bergerak,jadi selain para pengunjung blog kita mudah dalam mengetahui postingan terbaru kita,blog kita pun akan terlihat cantik.Cara memasangnya pun tidak terlalu sulit,sobat sekalian hanya membutuhkan beberapa menit saja untuk memasang recent post thumbnail bergerak di blog.Gimana? apa sobat mau memasangnya di blog sobat?




Coba sobat lihat pada sidebar blog saya ini,di sidebar blog saya ini,saya memasang recent post dengan thumbnail yang bergerak.

Bagi sobat sekalian yang ingin memasang recent post thumbnail bergerak silahkan ikuti beberapa langkah berikut
1.Login ke akun blogger sobat
2.Klik menu TATA LETAK (bagi sobat yang menggunakan antarmuka blogger yang lama,klik RANCANGAN)
3.Klik Tambah Gadget
4.Klik HTML/Javascript
5.Masukan kode berikut 

<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 = 0;
</script> <script src="http://www.aeroaxel.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script> </ul>
</center>

Perhatikan : Ganti tulisan yang saya beri tanda kuning,dengan alamat blog sobat

6.Klik SIMPAN
7.Selesai

Share on: Facebook Twitter Google+ Linkedin Technorati Digg LintasMe

Related Articles :