Breaking News
Loading...

Saturday, August 24, 2013

Membuat entri populer slide show pada blog

oke sobat kali ini saya ingin share tentang blogspot,
sebuah widget memang sangat penting bagi seorang publisher untuk itu bagaimana agar tampilan blog kita semakin memudahkan orang untuk mencari dan menulusuri entri entri pada blog kita, untuk itu saya rekomendasikan satu dari sekian banyak cara menghias blog di postingan para blogger, yaitu membuat slide show pada kolom entri populer

caranya cukup mudah sobat,
sobat tinggal copas aja script dibawah ini
<style type="text/css" media="screen">
    #PopularPosts1 {
    overflow:hidden;
    margin-top:2px;
    padding:0px 0px;
    height:400px;
    }
    #PopularPosts1 ul {
    width:280px;
    overflow:hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin:0px 0px;
    }
    #PopularPosts1 li {
    width:280px;
    padding: 5px 5px;
    margin:0px 0px 5px 0px;
    list-style-type:none;
    float:none;
    height:80px;
    overflow: hidden;
    background:none;
    border:1px solid #ddd;
    }
    #PopularPosts1 li .item-title {
        color:#A5A9AB;
        font-size:12px;
        margin-bottom:2px;
    }
    #PopularPosts1 li .item-title a {
    text-decoration:none;
    color:#4B545B;
    font-size:11px;
    height:18px;
    overflow:hidden;
    margin:0px 0px;
    padding:0px 0px 2px 0px;
    }
    #PopularPosts1 li img {
     float:left;
    margin-right:5px;
    background:#EFEFEF;
    border:0;
    }
    #PopularPosts1 li .item-snippet {
    overflow:hidden;
    font-family:Tahoma,Arial,verdana, sans-serif;
    font-size:12px;
    color:#262B2F;
    padding:0px 0px;
    margin:0px 0px;
    }
    #PopularPosts1 .item-snippet a,
    #PopularPosts1 .item-snippet a:visited {
        color:#3E4548;
        text-decoration: none;
    }
    #PopularPosts1 .spyWrapper {
        height: 100%;
        overflow: hidden;
        position: relative;  
    }
    #PopularPosts1 {
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
    }
    .tags span,
    .tags a {
     -webkit-border-radius: 8px;
     -moz-border-radius: 8px;
    }
    a img {
        border: 0;
    }
    </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" charset="utf-8">
    $(function () {
        $('.popular-posts ul').simpleSpy();
    });
    </script> <script src="http://accordion-for-blogger.googlecode.com/svn/trunk/simplespy.js" type="text/javascript"></scrip ></scrip

setelah script diatas dicopy tunggu dulu!! siapkan dulu
  • buka halaman dashbor blog sobat kemudian pilih >>TATA LETAK/LAYOUT>>ADDWIDGET>>HTML/JAVASCRIPT>>PASTEKAN KODE TERSEBUT DIDALAM WIDGET>> SAVE ATAU SIMPAN.
  • setelah disimpan letakkan WIDGET HTML/JAVASCRIPT tepat diatas WIDGET ENTRI POPULER lihat seperti gambar dibawah.
  • nah gampang kan? silahkan dicoba dan lihat hasilnya.

No comments:

Post a Comment

masukkan komentar anda selamat berbagi ilmu dan terimakasi atas kunjungannya