Membuat Recent Post Animasi di Blog

Share

Recent Post dalam Bahasa Indonesia berarti Posting baru-baru ini (Posting Terbaru). Widget Recent Post sangat bagus kalau di pasang di Blog sobat, karena Windget For Blogspot ini dapat mempercantik atau memperindah tampilan Blog dan dapat mempermudah pengunjung blog dalam mengetahui postingan terbaru dari blog sobat. Oleh karena itu, Tutorial Blogger kali ini akan membahas tentang bagaimana membuat Recent Post. Pada beberapa tutorial blog di situs lain, mereka memberikan Tutorial Blog tentang cara membuat recent post thumbnail, tetapi untuk Rinjani Lovers sendiri  akan memberikan tutorial tentang cara membuat recent post Animasi. Silahkan ikuti langkah-langkah di bawah ini!

Cara membuat Recent Post:

• Login ke akun blogger sobat di alamat http://www.blogger.com/
• Klik Design kemudian klik Add a Gadget
• Selanjutnya klik HTML/javascript
• Copy kode di bawah ini

<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://rinjanilovers.blogspot.com" target="_blank">get this widget here</a></small>

• Pada kolom title atau judul beri nama RECENT POST
• Selanjutnya pada kolom kedua, pastekan kode di atas.
• Kemudian klik Save atau simpan

Tambahan:

Tulisan yang berwarna merah adalah kode warna untuk Background, silahkan sobat ganti dengan warna Background yang sesuai dengan template sobat.
Angka yang berwarna kuning adalah Jumlah Post atau Postingan yang akan ditampilkan, silahkan sobat sesuaikan sendiri.

Artikel Terkait: