Membuat Nomor Urut Pada Popular Post

Membuat nomor urut pada popular post | membuat nomor otomatis pada popular post | Popular post with auto numbering

Hi mate,
kali ini saya akan share cara membuat nomor urut pada popular post. Jika kita menggunakan 10 artikel terfavorit maka angka urut itu dari 1 - 10. untuk lebih jelasnya silahkan lihat gambar dibawah :

Caranya pun cukup mudah kok,
Buka Template - Edit HTML
lalu cari kode ]]></b:skin> (gunakan ctrl+f untuk mencari kode) jika sudah ketemu letakkan kode script MBT Popular posts di atas ]]></b:skin>

/*--- MBT Popular Posts --- */
.popular-posts ul {
padding-left: 0px;
counter-reset: popcount;
}
.popular-posts ul li:before {
list-style-type: none;
margin-right: 15px;
padding: 0.3em 0.6em;
counter-increment: popcount;
content: counter(popcount);
font-size: 16px;
background: #a9a9a9;
color: #ffffff;
position: relative;
font-weight: bold;
font-family: georgia;
float: left;
border: 2px solid #dddddd;
box-shadow: 1px 2px 9px #666666; }

.popular-posts ul li {
border-bottom: 1px dashed #dddddd;
}
.popular-posts ul li:hover {
border-bottom: 1px dashed #696969;
}
.popular-posts ul li a {
text-decoration:none; color:#5A5F63;
}

.popular-posts ul li a:hover {
text-decoration:none;
}

ubah nilai pada background: #a9a9a9;  jika anda ingin merubah warna background,
ubah nilai pada color: #ffffff; untuk merubah warna text,
Nomor urut tersebut berupa kotak,jika anda ingin merubahnya menjadi lingkaran anda bisa menambahkan
border-radius:15px; tepat setelah box-shadow: 1px 2px 9px #666666;
setelah itu save template dan lihat hasilnya :)