Thursday, August 29, 2013

Cara Membuat Slideshow Postingan Blog


Membuat Recent Post Dengan Slideshow

Kali saya mau share tips dan trik blogging yaitu cara membuat slideshow postingan blog. Berikut langkah-langkahnya:

1. Buka dulu akun blogger kalian.
2. Pilih menu tata letak
3. Kemudian klik tambah gadget
4. Pilih HTML/javascript
5. Kemudian pastekan code javascript dibawah ini.

<style type="text/css">
#rp_plus_img{height:385px;overflow:hidden;border:0;padding:6px 10px 14px 5px;background: transparant;}
#rp_plus_img ul{list-style-type:none;margin:0;padding:0}
#rp_plus_img li{border:solid 1px #585858; margin:0; padding:0; list-style:none;}
#rp_plus_img li{height:85px;padding:5px;list-style:none;}
#rp_plus_img a{color:#000;}
#rp_plus_img .news-title{display:block;font-weight:bold !important;margin-bottom:4px;font-size:12px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #585858;width:65px;height:65px;}
</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="http://aan-punya.googlecode.com/svn/Slideshow%20Postingan.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 = 20;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>

6. Terakhir save / simpan dan lihat hasilnya

Untuk contohnya bisa anda lihat di sidebar kana blog saya.

Sekian dulu postingan saya kali tentang cara membuat slideshow untuk postingan terbaru blog.
Selamat mencoba

No comments:

Post a Comment