Ad 468 X 60

Kamis, Mei 23, 2013

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..


Get Free Email Updates Daily!

5 komentar:

  1. Jika logo MBT dihilangkan maka notif bar tidak bisa di hide ya..apa tidak ada cara lain kira2 agar ttp bisa di hide?

    Follow back sukses kawan.

    BalasHapus
    Balasan
    1. buat apa di ilangin logo mbt di notif bar,,, itung itung sebagai terima kasih ke mbt

      wah template nya pada sama :D

      Hapus
    2. hihi,, @isha ntar deh saya blom ngerti bahasa mesin Jquery, ga kbaca soalnya,, mesti pake aplikasi..

      @Deddia ga di ilangin, cuma buat belajar doang kok,, hihi ia ni sama template-nya,, mau ganti kan sayang.. udah berhari hari edit template,, :O

      Hapus
    3. Ternyata tidak hanya kita yg sama tapi ada beberapa blog lagi yg pakai template ini...

      Hapus
    4. di indo aja ada puluhan lebih yg pke template ini,, blum di India, sma diluar negeri lainya.. yg pasti klo blogger dah nyangkut di MBT pasti cpet berkembangnya,,

      Hapus