Ideini.Com | Situs Informasi Terkini!

Situs Media Informasi Online Yang Berisi Info Info Menarik, Terbaru dan Terhangat | Entertaiment | Teknologi | Olahraga | Hiburan

Widget Recent Post Bergerak Ke Bawah Dengan Thumbnail Blog

Panas hari ini tidak mengurangi niat saya untuk berpuasa dan terus ngeblog, ok sahabat blogger semua, pada postingan kali ini saya ingin berbagi cara membuat widget Recent Post dengan Thumbnail yang bergerak ke bawah, tampilanya terbilang cukup bagus, untuk yang ingin melihat Demo nya silahkan Klik Demo di bawah:


Untuk membuatnya ikuti langkah berikut :
  • Login ke Blogger
  • Pilih Rancangan >> Tata Letak >> Add Widget >> Html/javascript
  • Copy paste 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 = 45;
</script> <script src="http://b-bayu.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script> </ul>
</center>

note : untuk mengatur tinggi recent post dengan mengubah nilai height:300px.
             : ganti tulisan http://b-bayu.blogspot.com dengan Url Blog sobat.
  • Kalau sudah lalu Save.

1 Komentar untuk "Widget Recent Post Bergerak Ke Bawah Dengan Thumbnail Blog"