Edit Widget Artikel Populer Dengan CSS Untuk Blogger

Kali ini saya akan share ganistentang widget populer

Seperti yang ganis lihat kurang lebih akan tampil seperti itu
langsung saja.
reffrel: realcombiz

Langkah :

1. Buka akun Blogger Anda
2. Masuk ke menu Layout > Add Gadget > Popular Post (jika Anda belum menggunakan widget artikel populer), lalu buat dengan pilihan seperti pada gambar dibawah ini :

    3.  Lalu Save

    4.  Masuk ke menu edit HTML 

    5.  Cari kode dibawah ini :

]]></b:skin>

<style>
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNXf_Kfxbw3IqZTI400YwcSYqthu1inYWOWDkCsrD4u4NGLxAxXieacO6S9FkIoG6sMNOk5tpAVvH5sWdKNeZYGdvlHd56iSxF7UXGDl-gqrQUli90m-OLqj7zoRxtPG7swE0rtqPyAGg/s1600/rb+cancel+icon...jpg) no-repeat scroll 5px 10px;
list-style-type: none;
margin: 0 0 5px 0px;
padding: 5px 5px 5px 33px !important;
border: 1px dashed #dddddd;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
.popular-posts ul li:hover {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibXrxTBdJ2D1KCSsQ8tZ4_Ov_3tWRoWK0gcV947aS5tvTMidp0cbL-urzn-Afxh3CWOmGIcKhYZw0RNWfOVJ-M_mhER8s8sSDgMUIK6LtZgpeUhPgu6lXSGvQk8flc9uwSX2qub1z_pao/s1600/rb+mark+icon...jpg) no-repeat 2px;
border: 2px solid #b60000;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
}
.popular-posts ul li a:hover {
text-decoration:none;
}
</style>

    7.  Save Template Anda.

Terimakasih atas perhatiannya,semoga bermanafaat

Edit Widget Artikel Populer Dengan CSS Untuk Blogger 2013-01-11T17:51:00+07:00 Rating: 4.5 Diposkan Oleh: M Zaky Alfarisi