Cara Agar Popular Post Bergerak

Untuk cara membuat popular posts bergerak di blogspot.. 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 ya sobat professortau.

1. Login ke account bloger anda.
2. Klik Lay out atau Rancang seperti pada gambar dibawah

3. Klik Add Gadget seperti gamabar dibawah

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>