Membuat popular post / entri popular bergerak

menampilkan beberapa bagian bergerak pada laman depan merupakan salah satu trik untuk mempercantik tampilan blog, paling tidak membuat yang melihat tidak bosan. popular post / entry popular juga bisa kita buat berjalan, ada yang ke atas dan juga ada yang ke bawah. 

nah kali ini saya entri cara membuat popular post yang bergerak ke bawah, berikut caranya .

1. masuk ke blok anda

2. kemudian masuk ke tata letak.

3. klik tambah gadget.

4. klik entri popular post

setelah selesai mengarur sesuai keinginan lalu simpan. kemudian langkah selanjutnya.

5. klik tambah gadget lagi.

6. klik HTML/java scrip

7. masukkan code scrip 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>

8. atur tinggi dan lebarnya pada scrip tersebut, sesuaikan dengan tempatnya.
9.  klik simpan, dan lihat hasilnya

selamat mencoba, god luck