Cara Merubah Popular Post atau Entri Populer Menjadi Menarik

Kali ini Saya akan membahas cara mengedit popular post atau entri populer dengan border yang berubah efek ketika salah satu entri disentuh cursor.
Tutorial kali ini hanya untuk membuat popular post atau entri populer bagus dan rapih saja.

Caranya :

• Login ke blogger.com, jika sudah,
• Pilih Tata Letak → Tambah Gadget → Pilih Entri Populer
• Edit seperti gambar di bawah ini sesuai keinginan

• Setelah itu masuk ke Template → Edit HTML → Expand Template Widget
• Cari kode ]]></b:skin> agar mudah mencari tekan f3
• Setelah itu letakkan script di bawah ini di atas kode ]]></b:skin>

/*--- SCG Popular Posts --- */
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF url(masukkan url gambar) no-repeat scroll 5px 10px;
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border: 3px double #7b0000;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
.popular-posts ul li:hover {
border:3px double #6BB5FF;
}
.popular-posts ul li a:hover {
text-decoration:none;
}

• Simpan dan lihat hasilnya

Selamat Mencoba !