Home » » Membuat slide show vertikal Recent Post blogger

Membuat slide show vertikal Recent Post blogger

Written By Parmin Prim on 12 April 2013 | 12.59

Bagi para blogger tentunya ingin blognya kelihatan menarik dan bagus.  Karena itu segala model dan bentuk tampilan di atur sedemikian rupa untuk mendapatkan tampilan yang menarik tersebut.  Berikut ini adalah salah satu cara membuat slide show atau postingan terbaru (Recent Post) yang berganti-ganti atau bergerak dalam bentuk vertikal.  Slide show vertikal ini menggunaka kode javascript yang siap pakai, tinggal ambil dan pasang di blog kamu.

Contoh Slide show vertikal dapat anda lihat disebelah kiri dari blog ini. Bagaimana cara membuatnya? Ikuti langkah-langkah berikut :
  1. Pastikan anda berada pada dashboard blog anda.
  2. Pilih Tata Letak


  3. Kemudian klik Tambah Gadget


  4. Lalu pilih Gadget HTML/JavaScript


  5. Masukkan kode dibawah ini pada area Konten dan beri judul untuk Slide Show ini.

  6. <style type="text/css">
    #rp_plus_img{height:385px;overflow:hidden;border:0;padding:6px 10px 14px 5px;background:#99cc99;}
    #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://slide-show-vertikal.googlecode.com/files/Slideshow%20Post.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>
Share this article :

1 komentar:

Popular Posts

Posting Update

Chat Langsung

Diberdayakan oleh Blogger.

Follow by Email

 
Support : Primaya | Masprim | My Facebook
Redesain © 2015. primaya.blogspot.co.id - All Rights Reserved
Template Source from Creating Website
Proudly powered by Blogger