:.
Salam persahabatan, trik kali ini yang akan saya share adalah trik memasang nomor urut pda 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 DISINI
Kemudian 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 yang berwarna hijau 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>
TAMBAHAN:
Bagi 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>
KODE REPLY DAN KODE KOMENTAR ADMIN BIASANYA DISINI
<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 jangan lupa komennya
Postingan
0 komentar:
Posting Komentar