Membuat Recent Post Efek Slide Plus Thumbnails V2 With Jquery

Recent post menunjukkan apakah post terbaru yang baru dihasilkan oleh seseorang blogger untuk blognya.Dan sebelumnya saya juga udah share tentang Recent Post Thumbail . Dan kali ini saya share Recent Post Thumbail V2 . Adanya animated recent post widget, dapat menambahkan lagi 'seri' bagi senarai recent post anda.

Tutorial untuk membuat animated recent post ini adalah seperti berikut.

1. Dari Dashboard > Design > Add a Gadget > HTML/javascript
2. Copy semua kode dibawah ini lalu pastekan kedalam
HTML/javascript yang anda telah buka tadi :


<style type="text/css">
#rp_plus_img{height:377px;}
#rp_plus_img li {height:60px;padding:5px;list-style:none;
background-color:#ffffff;
border:solid 1px #000000;}
#rp_plus_img a{color:#00000;}
#rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
text-align:justify;
-moz-border-radius: 5px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://hanjs.googlecode.com/files/recentpostv2.js"></script>
<script type="text/javascript">
var speed = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img">
<script style="text/javascript">
var numposts = 5;
var numchars = 0;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul><small><a href="http://ahmadrijal-blog.blogspot.com/2012/04/membuat-recent-post-efek-slide-plus.html" target="_blank">Get This Gadget</a></small>
Note :
  1. Utuk kecepatannya anda bisa menggati kode yang berwarna merah
  2. Kalo untuk backgroundnya nda bisa menggantinya dengan kode warna yang anda sukai kode warna yang tertera pada kode diatas adalah warna orange anda bisa menggantinya sesuka hati anda.

1 Coment :