Cara Membuat Popular Post Bergerak

Untuk cara membuat popular posts bergerak di blogsport, caranya sangat mudah dan hampir sama seperti cara membuat recent post. Populer post bergerak ini banyak digemari para blogger untuk men SEO dan mempercantik blog mereka. Jika anda suka dengan gaya populer post bergerak diblog anda silahkan ikuti langkah-langkah cara membuat populer post bergerak di blogspot, berikut ini.
1. Login ke account bloger anda.
2.Klik Lay out atau Rancangan
3. Klik Add Gadget

4. Pilih Entri Populer seperti pada gamabar dibawah, kemudian klik save/ simpan

5. Langkah ke lima membuat populer post bergerak adalah, lakukan langkah seperti diatas yaitu klik layout/ Rancang >> Add Gadget lalu pilih HTML/ JavaScript seperti gambar dibawah
   

6. Lalu copy dan paste kode script dibawah ke gadget HTML/ JavaScript diatas tadi, contohnya lihat gambar dibawah. Jangan lupa klik Save/ Simpan.

<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>

Dan hasil populer post bergerak yang kita baut persisi seperti pada sidebar sebelah kanan blog duniajarkom25 ini. Selamat mencoba untuk membuat populer post bergerak semoga berhasil.