Posted by : Eva Fembiana Jumat, 15 Mei 2015

Popular post/ random post adalah sebuah widget yang berisi tentang postingan atau artikel yang ditampilkan secara acak, dengan jumlah tertentu sesuai yang kita inginkan. Popular post juga berfungsi untuk mengurangi bounce rate pula, keindahan popular post dengan widget lain adalah terletak pada postingan yang ditampilkan. Karenanya popular post menampilkan semua postingan yang ada di blog kita.

Pada tutorial kali ini saya akan membagikan tentang membuat popular post berjalan dari atas kebawah. Caranya cukup mudah untuk kalian pahami. Langkah-langkahnya sebagai berikut.

1. Masuk ke Dasbor home >> Tata Letak.


2. Kemudian klick tambahkan gadget >> HTML/Script.


3. Kemudian klick simpan pada buttom simpan tersebut dan lihat hasilnya.

Script detailnya sebagai berikut :

<div style="margin-bottom: 15px;">
<style type="text/css">
#rp_plus_img{height:287px;overflow:hidden;border:solid 0px #585858;padding:1px 5px 14px 1px;background-color:none;}
#rp_plus_img ul{list-style-type:none;margin:0;padding:0}
#rp_plus_img li{border:0; margin:0; padding:0; list-style:none;}
#rp_plus_img li{height:70px;padding:1px;list-style:none;}
#rp_plus_img a{color:#3366ff;}
#rp_plus_img .news-title{display:block;font-weight:bold !important;margin-bottom:5px;font-size:14px;}
#rp_plus_img .news-text{display:block;font-size:11px;font-weight:normal !important;color:#282828;text-align:justify;}
#rp_plus_img img{float:left;margin-right:10px;padding:1px;border:solid 1px #cccccc;width:60px;height:65px;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://slide-down-recent.googlecode.com/files/Slide%20Down%20Recent%20Post.js"></script>
<script type="text/javascript">
var speed = 400;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img">
<script style="text/javascript">
var numposts = 20;
var numchars = 60;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>
</div>

Cukup mudah bukan untuk sobat pahami. Semoga bermanfaat dan selamat mencoba yaa... :)

Leave a Reply

Subscribe to Posts | Subscribe to Comments

- Copyright © Fembiana's Blog - Blogger Templates - Powered by Blogger - Designed by Evalanche -