Nomor Urut Komentar (Numbering Comment) Blogger

Apa itu blogger numbering comments, sudah pada tahu ya. Bagi yang belom, blogger numbering comments atau nomor urut komentar blogger adalah angka yang ditampilkan sebagai nomor urut komentar yang masuk ke artikel posting blog. Numbering comments ini dibuat oleh Fernandooo1 blogger senior dari luar sana. Fernandooo1 hanya dengan menggunakan kombinasi sederhana JavaScript dan CSS style pada template blogger yang sangat mudah kita praktekkan. Nomor urut komentar bisa dilihat pada gambar berikut :


Tertarik untuk memasangnya pada blog anda? Kalau ia, silahkan ikuti cara berikut. Namun sebagai catatan sebelum anda memulai, mungkin ada perbedaan pada beberapa template. Saya melakukan ujicoba pada template Minima White punya blogger dan pada blog ini sudah saya uji. Memang ada beberapa perbedaan pada kode CSS blog saya, namun bisa disesuaikan dengan kode-kode yang mirip. Oke, mari dilanjutkan.

Pasang Nomor Urut Komentar (Numbering Comment) Blogger

1. Login ke blog dengan ID anda
2. Masuk ke Layout
3. Pilih tab Edit HTML
4. Centang kotak kecil Expand Template Widget
5. Sebaiknya backup dulu template anda dengan mengklik Download Full Template
6. Carilah kode berikut pada template anda dan Tambahkan hanya kode yang berwarna hijau saja :

<b:includable id='comments' var='post'>
........

<dl id='comments-block'>

<script type='text/javascript'>var CommentsCounter=0;</script>

<b:loop values='data:post.comments' var='comment'>

<dt style='clear: both;' class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'>
<data:comment.author/>
</a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>

<span class='numberingcomments' style='float: right; font-size: 20px;'>
<a expr:href='data:comment.url' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>

</dt>

<dd class='comment-body'>
........

</dd>

</b:loop>
</dl>

7. Kemudian klik tombol SAVE TEMPLATE

Pada kode font-size: 20px;, silahkan ganti ukuran angka tersebut agar pas dengan blog anda. Udah, itu aja koq cuman dikit dan mudah. Bagi yang sudah mahir kode CSS bisa memperbaharui nomor urut agar lebih cantik. Selamat, sekarang anda sudah bisa menambahkan nomor urut komentar di blog. Terima kasih.

Related Post:

Trik Blogspot

• Menambahkan Image Pada Judul Posting
• Mengganti Pager Link Blogger Dengan Icon
• Klik Label Tampil Hanya Judul Posting Update
• Klik Label Tampil Hanya Judul Posting
• Menambahkan Icon Pada Label Dan Link Sidebar
• Mengganti Tanggal Dengan Icon Kalender
• Menghilangkan Icon QuickEdit (Tang dan Obeng)
• Area Sidebar Dalam Kotak Terpisah
• Area Komentar Dalam Kotak Terpisah
• Area Posting Dalam Kotak Terpisah
• Background Warna Pada Teks Posting
• Modifikasi Pesan Pengantar Formulir Komentar
• Beda Tampilan Komentar Pemilik Blog
• Pasang Emoticon Di Atas Kotak Komentar
• Membuat Blockquote Dan Modifikasi Blockquote
• Masalah Pada Verifikasi Kotak Komentar
• Membuat Teks Berkedip Blink Text
• Membuat Horizontal Navigasi Blogger
• Avatar Profil Komentar Blogger Update
• Latar Belakang Teks Dengan Efek Stabilo
• Menggunakan Gambar Untuk Latar Belakang Blog
• Pasang Strip-Ad Seperti Navbar Blogger
• Menghilangkan Border Pada Image Posting
• Modifikasi Border Photo Profil Blogger

or or