Cara Membuat Popular Post Bergerak DiBlog

Hahihuheho - Pada kesempatan kali ini saya akan membagikan tips blog tentang Cara Membuat Popular Post Bergerak.

Sebenarnya Popular Post sudah ada dan disediakan oleh blogger sendiri, tapi kurang mantap, karena bentuk dan modifnya biasa biasa saja, tidak bisa naik turun.

Sobat yang mau membuat popular post bergerak, simak langkah langkah berikut

Cara Membuat Popular Post Bergerak DiBlog

1. Login keakun blog sobat
2. Pilih TataLetak --> Tambahkan Gadget
3. Pilih Entri Popular --> Centang Semua Kotak
4. Simpan 

Jika sudah maka di blog sobat sudah ada Popular Postnya, tapi Popular Postnya belum bisa bergerak. Agar Popular Postnya bergerak, simak Langkah langkah di bawah ini

1. Pilih Tata Letak --> Tambahkan Gadget
2.Pilih HTML/JavaScript
3. Masukkan Kode Di bawah ini

<style type="text/css" media="screen"> #PopularPosts1 { overflow:hidden; margin-top:5px; padding:0px 0px; height:400px; } #PopularPosts1 ul { width:340px; overflow:hidden; list-style-type: none; padding: 0px 0px; margin:0px 0px; } #PopularPosts1 li { width:340px; padding: 5px 5px; margin:0px 0px 5px 0px; list-style-type:none; float:none; height:80px; overflow: hidden; background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x; border:1px solid #ddd; } #PopularPosts1 li .item-title { color:#A5A9AB; font-size:1em; margin-bottom:0.5em; } #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:10px; 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"></script>

  4. Simpan! Dan lihat Hasilnya!

loading...