Tuesday, February 14, 2012

Cara Membuat Recent Post Dengan Thumbnail Bergerak Sendiri

kali ini kita akan membahas tentang Cara membuat Resent Post bergerak.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 Resent Post dengan tumnail. 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 resend post 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:1px 1px 1px 1px;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:2px;list-style:none;}
#rp_plus_img a{color:#F68629;}
#rp_plus_img .news-title{display:block;font-size:12px;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:12px;padding:1px;border:solid 1px #F68629;width:45px;height:45px;}
</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.ken-zoo.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script> </ul>
</center>

 Perhatikan : Ganti URL,dengan alamat blog sobat

6.Klik SIMPAN
7.Selesa

0 comments:

Post a Comment