Membuat Nomor Otomatis Pada Urutan Komentar Blog

Seperti tag blogspot yang menggunakan urutan Ordered List misalnya : <ol> untuk memberi urutan hirarki dan setiap komentar mengandung tag <li> secara terpisah untuk urutan komentar, menurut dari sang penulis MBT Blogger Pro yang telah mempengaruhi jiwa-jiwa muda untuk menjadi seorang blogger handal ini Tutorial ini akan membawa kita untuk lebih dekat menuju ke Mesin Komentar Wordpress. dan rasa kagum dengan web W3 yang telah memperkenalkan dengan baik cara untuk memberi nomor otomatis pada komentar blog dalam struktur HTML dan Murni dengan Properti CSS3 seperti Counter-Reset dan Counter-Increment, apa itu Counter-Reset dan Counter-Increment ? yaitu Suatu fungsi untuk mendekatkan Non-javascript atau tanpa Javascript dan hanya menggunakan css untuk urutan komentar blogger seperti plugin Wordpress yang sekarang Populer yaitu Urutan Nomor Greg.
Untuk blog yang menggunakan Template Custom atau yang ingin mencoba tutorial ini menurut penulis agar Menggunakan Treaded Comment atau Urutan Komentar Blog.

Ok Sekarang kita mulai bekerja :

  • Seperti Biasa - Masuk Blog - Klik Pilihan Template - Pilih Edit HTML
  • dan Cari Code berikut ini :
  • </b:skin> Seperti gambar dibawah

  •  Copy Script dibawah ini dan Letakan Diatas Kode </b:skin> :

/*----- Comment Counter-----*/

.comment-thread ol {
counter-reset: mbt-comments;
}
.comment-thread li:before {
content:counter(mbt-comments);
counter-increment: mbt-comments;
font-size: 30px;
float:left;
position:relative;
top:0px;
left:-10px;
margin-right:0px;
height:100px;
margin-right:0px;
font-weight:bold;
font-family:arial, georgia;
color: #666;
}
.comment-thread ol ol {
counter-reset: mbt-comments-sub;
}

.comment-thread li li:before {
content: counter(mbt-comments) "." counter(mbt-comments-sub,lower-latin);
counter-increment:mbt-comments-sub;
font-size: 12px;
color: #666;
position:relative;
top:10px;
}


.comments .comments-content .comment-header, .comments .comments-content .comment-content {  margin:0px 0px 8px 28px!important;}

Untuk Berwarna Hijau itu adalah bentuk Ukurannya dan Yang Biru adalah Warnanya, silahkan ganti sesuai dengan keinginanmu sendiri,,
Tinggalkan pertanyaanmu segera untuk mendapatkan perubahan yang lebih baik atau sesuai keinginan sobat.. Thanks before if you fun to read my post..


0 Komentar