Apa kabar sahabat blogger semua, dihari minggu yang cerah saya akan mengetengahkan sebuah trik untuk sahabat semua. Ttrik kali ini yang akan saya share adalah
Cara Memasang Nomor Urut pada Komentar. Dengan sedikit modifikasi pada template maka tampilan komentar blog sobat akan lebih menarik dengan adanya nomor urut komentar.
Kalau di blog sobat belum ada nomor urut komentarnya, sobat bisa memasangnya dengan mengikuti tutorial di bawah ini :
Masuk ke blogger dengnan ID teman
Pilih Design >> Edit HTML
Backup terlebih dahulu sebelum sobat memulai untuk memodifikasi template,
Setelah itu cari kode ini ]]></b:skin> (biar cepat Ctrl+F)
Lalu kode di bawah ini tepat di atas kode ]]></b:skin>
.TrikBloggerKomentar{
float: right;
display: block;
width: 50px;
margin-right: 5px;
margin-top: -35px;
text-align: right;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 30px;
font-weight: normal;
}
.TrikBloggerKomentar a:link, .TrikBloggerKomentar a:visited {color: #445566 !important; text-decoration: none !important;}
.TrikBloggerKomentar a:hover, .TrikBloggerKomentar a:active {color: #FF9933 !important; text-decoration: none !important;}
Untuk kode yang berwarna
merah di atas, silahkan sobat ganti dan sesuaikan dengan warna template blog sobat.
Untuk kode warna silahkan sobat lihat
DISINIKemudian cari kode seperti ini
<dl id='comments-block'>
Kode di atas berbeda-beda pada tiap template, jika belum ketemu coba kode seperti di bawah ini:
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
Setelah ketemu, perhatikan penempatan kode di bawah ini
(Intinya sobat hanya menyisipkan kode yang berwarna merah itu)
<dl id='comments-block'>
<script type='text/javascript'>var CommentsCounter=0;</script>
<b:loop values='data:post.comments' var='comment'>
<div class='' expr:id='data:comment.id'>
<dt 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='TrikBloggerKomentar'>
<a expr:href='"#comment-" + data:comment.id' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>
</dt>
<dd class='comment-body'>
.......
</dd>
</div>
</b:loop>
</dl>
Atau untuk sebagian template (jika kode di atas tidak ada)
Cari kode seperti di bawah ini
<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'>
<div class='' expr:id='data:comment.id'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</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='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
<span class='TrikBloggerKomentar'>
<a expr:href='"#comment-" + data:comment.id' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>
</dt>
<dd expr:class='"comment-body " + data:comment.commentAuthorClass' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
<span class='interaction-iframe-guide'/>
</p>
</b:if>
</dd>
</div>
CATATANBagi sobat yang sudah memasang fitur replay dan komen admin berbeda dengan pengunjung dapat melihat kodenya seperti di bawah:
<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'>
<div class='' expr:id='data:comment.id'> <dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</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='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
<span class='TrikBloggerKomentar'> <a expr:href='"#comment-" + data:comment.id' title='Comment Link'> <script type='text/javascript'> CommentsCounter=CommentsCounter+1; document.write(CommentsCounter) </script> </a> </span> </dt>
<dd expr:class='"comment-body " + data:comment.commentAuthorClass' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
<span class='interaction-iframe-guide'/>
</p>
</b:if>
</dd>
</b:if>
</div> Setelah selesai simpanlah template sobat
Selamat mencoba dan semoga bermanfaat
RESENSI
Trik Blogger | http://trik-blogger-andreas.blogspot.com/2011/01/trik-memasang-nomor-urut-komentar.html
