Aplikasi & Fitur
1. Dengan Favicon
2. Efek Hover
3. Jika mouse diarahkan ke suatu link dalam widget tersebut, otomatis garis abu-abu akan berubah sesuai dengan warna link blog anda.
4. Anda bisa memodifikasi widget ini sesuka hati.
5. Dengan CSS.
Cara Membuat
1. Klik Tata Letak, lalu klik Add gadget.
2. Pilih Widget Popular Post/Entri Populer.
3. Isikan judul Popular Post blog anda, lalu tentukan jumblah post yang tampil. Jangan lupa untuk tidak mencentang kolom thumbnail gambar/Image Thumbnail & Cuplikan/Summary.
4. Lalu, klik Simpan/Save.
Eeeit, Tunggu Dulu Gan!! Tampilan Popular Post dengan cara diatas, masih manual (Standard), tanpa efek hover. Nah, untuk memberikan efek hover pada popular post, letakkan kode dibawah ini, diatas kode ]]></b:skin>.
<style>
/*--- Www.infoiki.blogspot.coM Popular Posts --- */ .popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNRn4zVII7VlBx9ZN4BeyjPN8-wJ1JxXaYgs1qlPB7rKNPPEhpYybFSfNwLLO_OKfxIdH0C6vYBD1YeY_vBh78vmSGAe4WxBb-b4P37AJQ9iAzIhUwUQva5QcX0DplIWHXon0nCbUbc_w/s1600/helperblogger-list-style-icon.png) no-repeat scroll 5px 10px;
list-style-type: none; margin:0 0 5px 0px; padding:8px 5px 7px 22px !important;
border-bottom: 2px dotted #dddddd; } .popular-posts ul li:hover { border-bottom: 2px solid #6BB5FF; } .popular-posts ul li a:hover {
text-decoration:none; } </style>
Kode diatas adalah kode css Popular Post. Silahkan agan modifikasi sendiri. Setelah berkreasi, jangan lupa klik Save template. Dan Selesai!
Selamat Berkreasi! :)
sip gan keren,, dah tak praktekin.
klau ukuran huruf di perkecil gmna sob??
http://sibloggerklaten.blogspot.com