Membuat Recent Post Thumbnail dengan Slideshow

Pada kesempatan yang bahagia ini  saya mau berbagi dengan sobat yaitu sebuah tutorial blog. Tutorial yang saya bahas kali ini yaitu membuat Recent Post dengan Thumbnail dan juga slideshow. Mungkin sobat bosan dengan recent post yang biasa-biasa. Nah, agar recent Post sobat lebih menarik sobat wajib menggunakan tutorial ini. Nih, Screenshot nya.
Berikut langkahnya :
  • Pertama sobat login dulu ke blogger.com
  • Kemudian pergi ke menu Tata Letak →Tambah Gadget →Pilih Javascript/HTML
  • Kemudian copy dan paste kode dibawah ini 

<style type="text/css">
    #rp_plus_img{height:377px;}
    #rp_plus_img li {height:60px;padding:5px;list-style:none;
    background-color:#ffffff;
    border:solid 1px #000000;}
    #rp_plus_img a{color:#00000;}
    #rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
    text-align:justify;
    -moz-border-radius: 5px;}
    #rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
   
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">
</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>
    var numposts = 5;
    var numchars = 0;
   
</script>     <script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script>     </ul>
  • Terakhir Save
Semoga bermanfaat dan jangan lupa tinggalkan komentar dibawah
0 Komentar untuk "Membuat Recent Post Thumbnail dengan Slideshow"