Cara Membuat Popular Post Super Keren diBlog

Assalamualaikum Syedara..!!

Pada malam ini saya akan mengajarkan cara mempercantik tampilan menu Popular Post pada blog dengan sedikit sentuhan CSS, biasanya setiap pengunjung blog selalu melihat postingan terbaru diblog sobat, karena saya sarankan untuk memodifikasinya. Mungkin sobat sudah penasaran kali, saya akan berikan screenshoot'a sebagai berikut :

Oke tanpa basa-basi lagi langsung kita olah TKP, cekidoott :D

• Login ke blog masing-masing
• Masuk ke menu Template dan edit HTMLnya
• Kemudian cari kode  kode ]]></b:skin> dan letakkan kode dibawah ini tepat diatas kode ]]></b:skin>

.popular-posts ul{padding-left:0px;}.popular-posts ul li {list-style-type: none;margin: 0px 0px 5px;padding: 5px 5px 5px 20px !important;border: 1px solid #dddddd;border-radius: 30px 0 30px 0;    -moz-border-radius: 30px 0 30px 0;    -webkit-border-radius: 30px 0 30px 0;    -o-border-radius: 30px 0 30px 0;    transition: all 0.5s;    -moz-transition: all 0.5s;    -webkit-transition: all 0.5s;    -o-transition: all 0.5s;}.popular-posts ul li:hover {border:1px solid #666666; box-shadow: 1px 1px 10px 3px rgba(0,0,0,0.5);    border-radius:0;    -moz-border-radius:0;    -webkit-border-radius:0;    -o-border-radius:0;}.popular-posts ul li a:hover {text-decoration:none;}

• Kemudian simpan templatenya dan lihat hasilnya :D

Note : Jika sebelumnya pernah menggunakan kode lain untuk mempercantik tampilan Popular Post, saya sarankan untuk menghapusnya agar script kodenya tidak bentrok/beradu :D

Selamat mencoba, semoga berhasil...:D

BAGIKAN ARTIKEL : Facebook Twitter Google+ Linkedin