Cara Membuat Random Post Bergerak Dengan Gambar Responsive Di Blog Terbaru

Pada kesempatan kali ini Zacky Blog akan memberikan Tutorial Cara Membuat Random Post Bergerak Dengan Gambar Responsive Di Blog, Random post sendiri berguna untuk menampilkan artikel secara acak,dengan tujuan menarik pengunjung agar berminat untuk membaca artikel sobat yang sudah lalu maupun yang baru saja di tulis.

Random post yang akan saya bagikan kali ini sangat keren dan Responsive dan juga mudah untuk penerapanya sobat tidak harus mengutakatik Template sobat, Untuk sobat yang ingin menggunakan Random Post Bergerak dengan gambar responsive ini silahkan di simak langkah - langkahnya di bawah ini.

Cara Membuat Random Post Bergerak Dengan Gambar Responsive Di Blog

- Silahkan sobat masuk ke blogger
- Lalu sobat pilih menu Tata letak > Tambahkan Widget/Gatget > HTML/javascript
- Kemudian Copy kode di bawah ini

JS

<style>

#BDRSimage-slide { height:112px; overflow:hidden; padding:0; background-color:#fff; width:auto; border:solid #ddd 1px; box-shadow:0 0 5px #eee; }

#BDRSimage-slide:hover { height:325px; overflow:hidden; padding:0;width:auto; border:solid #ccc 1px; box-shadow:none; }

#BDRSimage-slide li { list-style:none; height:80px; padding:10px; border:dashed #ddd 1px; margin:5px; background-color:#FFFFFF; }

#BDRSimage-slide ul { list-style-type:none; margin:0; padding:0; }
#BDRSimage-slide li:hover { border:solid #ddd 1px; }

#BDRSimage-slide .news-title { margin-bottom:5px; font-size:12px; color:#990000; }

#BDRSimage-slide a { color:#222; font-family:Verdana; font-size:12px; font-weight:bold; text-decoration:none; }

#BDRSimage-slide img { float:left; margin-right:10px; margin-top:10px; width:60px; height:60px; border-radius:50%; border:1px solid #e06666; box-shadow:0 0 2px #e06666; }

#BDRSimage-slide .news-text { font-size:10px; color:#333; text-align:left; font-family:Verdana; font-style:italic; font-weight:normal; padding-bottom:10px; }
</style>
<script type="text/javascript"

var pause = 3500;

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/rp2-seocips.js"></script>
<!-- script start -->
<script type="text/javascript">
var speed = 400;

src="http://zackypurbalingga.blogspot.com/feeds/posts/default/?orderby=published&alt=json-in-script&callback=randompost"></script>

$(document).ready(function(){
rivaiscript();

interval = setInterval(rivaiscript, pause);
});
</script>
<div >
<ul id="BDRSimage-slide">

var numchars = 0;
<script style="text/javascript">
var numposts = 50;
</script>
<script

</ul>

</div> <!-- script end -->

- Ganti tulisan yang berwarna merah dengan alamat Blog sobat
- Kemudian Save widget

DemoClick here

Demikian Tutorial Cara Membuat Random Post Bergerak Dengan Gambar Responsive Di BlogTerbaru yang dapat Zacky Blog berikan semoga bermanfaat. Terimakasih !!!

Tweet

Zacky Purbalingga

Blog Untuk Download Games PC Gratis

Subscribe To Receive Free Email Updates: