Cara Membuat Widget Recent Post dengan Efek Animasi

Posted by Unknown at 2/10/2013 Read our previous post

Fungsi Widget Recent Post itu sendiri sesuai dengan namanya yaitu berfungsi untuk menampilkan dan memberitau kepada pengunjung mengenai postingan terbaru dari blog sobat. Mungkin beberapa dari sekian banyak sobat blogger Dapur Tutorial Blogspot dan Seo tertarik untuk menerapkan Widget Blogspot yang satu ini.

Langsung saja kita bahas resep-resepnya sebagai berikut :

Patikan sobat sudah login ke akun blogger masih masing
Jika sudah login silahkan Pilih Menu "Tata Letak "

Tambah Gadget

Tambahkan Widget HTML/JavaScript.

Sekarang Copas kode dibawah ini dan letakan kedalam kolom Widget HTML/JavaScript

<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="https://sites.google.com/site/unwanted86/javascript/recentpost.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://dapur-tutorial.blogspot.com/2013/02/cara-membuat-recent-post-dengan-efek-animasi-di-blog.html" target="_blank">Get a Widget</a></small>