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.

cara membuat popular post keren, cara membuat popular post bergerak, cara membuat popular post keren di blog.

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


cara membuat popular post keren, cara membuat popular post bergerak, cara membuat popular post keren di blog.

2. Pilih HTML/Java Scrip


cara membuat popular post keren, cara membuat popular post bergerak, cara membuat popular post keren di blog.

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.......
Tag : cara membuat popular post keren, cara membuat popular post bergerak, cara membuat popular post keren di blog, tutorial ngeblog, tips blogging.


Portal StatistikTentang Aditya

Hanya ingin berbagi pengalaman yang saya punya tentang Nge-Blog, Desain Grafis, Edit Foto, dan Info menarik lainnya seputar komputer. Semoga informasi yang saya bagikan dapat bermanfaat.

Previous
Next Post »