![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbwrmm0KrZcTiy9X920WEuJeJD0fJbQ6H8b5dCbyUf130F4msnAwDSTmUfo8gk2aciEkE-Vg52J2yx0P9kB7YPHExRPlBjxkh045tbp5pssP1lgJikVSheH6ymUWPzhvxSJuWSC_-B1Wpn/s320/Random+Post.png)
Baca Juga : Membuat Halaman Tool CSS Minify Pada Blog
Cara Membuat dan Memasang Widget Random Post
1. Masuk ke Blogger
2. Pilih Menu Tata Letak
3. Tambahkan Gadget HTML/ Java Script
Masukkan kode dibawah ini
<style type="text/css">
/*widget*/
#rp_plus_img{overflow:hidden;border:solid 1px #ddd;padding:10px; background-color:none;line-height:1.7em;}
#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:normal !important;margin-bottom:5px;font-size:14px;}
#rp_plus_img .news-text{display:block;font-size:12px;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:60px;border-radius:4px;}
</style>
<!-- start -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/Brando07/share/master/random-post-bergerak-seocips.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 = 5;
var numchars = 0;
</script>
<script src="http://www.blog.diversan.xyz/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>
<!-- /end -->
/*widget*/
#rp_plus_img{overflow:hidden;border:solid 1px #ddd;padding:10px; background-color:none;line-height:1.7em;}
#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:normal !important;margin-bottom:5px;font-size:14px;}
#rp_plus_img .news-text{display:block;font-size:12px;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:60px;border-radius:4px;}
</style>
<!-- start -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/Brando07/share/master/random-post-bergerak-seocips.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 = 5;
var numchars = 0;
</script>
<script src="http://www.blog.diversan.xyz/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>
<!-- /end -->
Keterangan
Kode Berwarna Kuning adalah waktu bergantinya Postingan
Kode Berwarna Merah diganti dengan URL blog sobat
5. Klik Simpan dan Selesai
Bagaimana? mudah bukan cara membuatnya?
Penutup
Demikian Tutorial Membuat Widget Random Post Bergerak Pada Blogspot dengan Mudah kali ini, semoga dapat bermanfaat bagi sobat, jika ada yang kurang jelas sobat dapat bertanya di kolom komentar.
Sumber Kode disadur dari blog SEOCIPS
Tidak ada komentar:
Posting Komentar