Cara Membuat Popular Post Bergerak

Cara Membuat Popular Posts Bergerak - Bagaimana cara membuat Popular Posts bergerak?. Popular Post Merupakan widget yang sangat penting yang harus dimiliki blog, tujuan Popular Post adalah agar pengunjung dapat langsung melihat Artikel-artikel yang sering di kunjungi di Blog anda.

Ada banyak cara yang digunakan agar tampilan Popular Posts menarik untuk dilihat. Disini saya akan membahas cara membuat Popular Post Bergerak Ke Bawah, Berikut adalah langkah-langkah untuk membuat Popular Post Bergerak.

Baca Juga : Cara Mengecilkan Size Foto Online Tanpa Mengurangi Kualitas

1. Masuk ke Dasbor Blog sobat, masuk ke menu Tata Letak - Tambahkan Gadget.

2. Pilih HTML/Java Scrip

3. Copy kode dibawah dan pastekan di area HTML

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

Simpan, Selesai.......

Sekian tutorial Cara Membuat Popular Posts bergerak, semoga bermanfaat........

Baca Juga  :

Cara Cepat Meningkatkan Earning Di Adf.ly

Cara Membuat atau Menempatkan Iklan dibawah Postingan Blog

Cara Status Banyak yang Like Otomatis di Facebook

Tag : cara membuat popular post keren, cara membuat popular post bergerak, cara membuat popular post keren di blog, tutorial ngeblog, tips blogging.

Share :