Cara Mudah Membuat No.Urut Komentar Di Blogspot

Tampilan Komentar akan lebih menarik bila kita kasih nomer urut pd setiap komentar, dan pastinya komentar-komentar akan terlihat lebih rapi dan dengan mudah kita bisa tahu berapa komentar yg sudah ada. mungkin itu fungsi dari judul diatas.
Bila sobat tertarik untuk membuatnya dan menaruh di blog sobat, silahkan ikuti beberapa cara dibawah ini.

Gambar

Berikut langkah-langkahnya :


1. Login ke Blogger Sobat

2. Pilih Tata Letak

3. Edit HTML dan ceklist/centang "Expand Template Widget"

4. Sebelum terlalu jauh, biasakan membackUp template sobat dulu, dengan cara klik "Download Template Lengkap"

5. Carilah kode berikut : <dl id='comments-block'> dan ternyata di template saya gak ada kode tersebut, jadi kalo di template sobat jg gak ada cari dengan kode berikut : <dl expr:class='data:post.avatarIndentClass' id='comments-block'>

6. Kalu sudah ketemu kodenya, selanjutnya sobat simak baik-baik kode dibawah ini :

Cara 1. Karena masing-masing template pasti berbeda saya jg kasih contoh pada template saya sendiri :

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

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

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

<dt class='comment-author' expr:id='data:comment.anchorName' style='clear: both;'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='35px' style='margin-bottom:-2px;' width='35px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='external'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>

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

</dt>


Cara 2.
Nah ini alternatif kode CSS pada templates blog :

<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: 18px;'>
<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'>

7. Selanjutnya, sobat hanya perlu menambah kan kode yang di beri warna merah.
Oia di atas ada dua (2) cara, karena saya kode dimasing-masing template kita pastilah berbeda, jadi dari dua cara diatas mana kiranya yg cocok dengan template sobat.

8. Untuk merubah besar kecilnya No. komentar sobat cukup mengganti pada kode berikut : font-size: 18px;

9. Simpan Template, dan lihat hasilnya.


Kiranya cukup sekian dari saya, selamat mencoba dan semoga berhasil.
Sumber : http://anggasona-anotherbestblog.blogspot.com

No comments:

Post a Comment