Cara Membuat Random Post Disertai Gambar Dengan Efek Bergerak

Selamat datang agan atau aganwati kali ini bertemu dengan saya pada kesempatan kali ini, kali ini saya akan berbagi tentang tips blogging yaitu cara membuat widget random posts disertai thumbnail atau dikenal dengan gambar dengan efek bergerak. Widget random post disertai gambar dengan efek bergerak merupakan widget pada blog yang menampilkan artikel-artikel pilihan pada blog secara acak serta pada widget tersebut ditampilkan juga gambar artikel disertai dengan efek yang bergerak secara vertikal kebawah.


Widget ini sangatlah efektif untuk menjaring pengunjung yang datang karena, bisa saja widget tersebut menampilkan daftar artikel yang menurut pengunjung menarik untuk dikunjungi. Dengan begitu akan sangat tepat sekali bagi anda yang ingin meningkatkan jumlah trafik yang anda miliki dengan memasang widget tersebut.


Berikut tutorial untuk memasang widget random post with thumbnail dengan efek bergerak :

Demo

Langkah

1. Login ke dashboard blog anda masing-masing,

2. Pada menu dashboard pilih menu tata letak,

3. Setelah itu pilih tambahkan gadget,

4. Setelah itu pilih menu html / javascript,

5. Setelah itu copy script berikut ini,

 <div style="margin-bottom: 15px;">
<style type="text/css">
#rp_plus_img{height:640px;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:130px;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 = 60;
var numchars = 0;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>
</div> 

6. Paste ke kolom html / javascript yang sudah tersedia,

7. Simpan, dan lihat hasilnya.



Demikian artikel tentang cara membuat random post disertai gambar dengan efek bergerak, semoga bermanfaat, jangan lupa bagikan serta tinggalkan komentar anda, terima kasih.

Share this