Selain bisa mengubah desain template sesuka hati kita kita juga bisa mengubah-ubah widget (plugins). Salah satunya dengan menambahkan nomor pada komentar blog kita di blogspot/blogger. Sebelumnya jangan lupa mengcopy script widgetnya untuk backup jika terjadi apa-apa
1. Login --->>> Tata Letak --->>> Edit HTML.
2. Centang "Expand widgets template".
3. Tekan ctrl + F cari kode <dl id='comments-block'> . Kemudian tambahkan kode warna merah diantara kode-kode <dl id='comments-block'>, seperti yang terlihat dibawah ini:
<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 expr:class='"comment-author " + data:comment.authorClass'
expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
<span class='comment-number'>
<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'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</div>
</b:loop>
</dl>
.comment-number {
float: right;
background: url(http://img24.imageshack.us/img24/875/iconcomments3.png) no-repeat;
width:50px;
height:50px;
margin-right: 15px;
margin-top: -35px; /*posisi nomor urut*/
text-align: center;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 18px;
font-weight: bold;
}
/*warna nomor urut*/
.comment-number a:link, .comment-number a:visited {
color: #445566 !important;
text-decoration: none !important;
}
.comment-number a:hover, .comment-number a:active {
color: #FF9933 !important;
text-decoration: none !important;
}
Kode warna merah adalah background untuk nomor urut, jika sobat blogger tidak ingin memberi background tersebut kode warna merah bisa dihapus atau mungkin diganti dengan gambar background milik sobat blogger sendiri. Happy Blogging!!
Sumber: Fernandooo1
