Membuat Popular Post Bergerak Untuk SEO Blog

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

Dan hasil populer post bergerak yang kita baut persisi seperti pada sidebar sebelah kanan blog KERJA ONLINE ini. Selamat mencoba untuk membuat populer post bergerak semoga berhasil.
Description: Membuat Popular Post Bergerak Untuk SEO Blog Rating: 4.5 Reviewer: Unknown - ItemReviewed: Membuat Popular Post Bergerak Untuk SEO Blog