Contoh no urut dengan gambar dapat di lihat gambar di atas.
Langsung ke cara ya, lagi males basa basi:
1. Login blog
2. Rancangan dan edit html
3. Centang expand widget template
4. Letakkan kode di bawah ini, di atas kode ]]><skin
Url gambar berwarna merah dapat di ganti dengan url gambar sobat.
5. Kemudian cari kode <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
Dan letakkan kode script merah seperti kode di bawah ini:
6. Selanjutnya simpan template dan lihat hasilnya.
Demikian tutorial cara memberi nomor komentar dengan gambar pada blog
apabila ada cara yang kurang di mengerti dapat di tanyakkan di kotak komentar.
Semoga infonya bermanfaat.
1. Login blog
2. Rancangan dan edit html
3. Centang expand widget template
4. Letakkan kode di bawah ini, di atas kode ]]><skin
/* www.cybermig.com*/
.numberingcomments a:link, .numberingcomments a:visited {
color: white !important;
text-decoration: none !important;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-BdroR_1WsgVXBD3eXYvhKirT_mMK8TPZVtgSZHt4J34paTQZKFpZMBxiOFU3mVl9Z2a7JqCyaDp5qLGLWRoprHVMCz86QDl0TEndk6ClClV4hGGVT8zrhfWQPOMeIZ4U8nThMZ_IQb4/s1600/CloudNumb.jpg) no-repeat;
width: 50px;
height: 48px;
float: right;
display: block;
margin-right: 5px;
margin-top: -15px; /*comments-counter position*/
text-align: center;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 15px;
font-weight: normal;
}
.numberingcomments a:hover, .numberingcomments a:active {
color: gray !important;
text-decoration: none !important;
}
Url gambar berwarna merah dapat di ganti dengan url gambar sobat.
5. Kemudian cari kode <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
Dan letakkan kode script merah seperti kode 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'>
<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='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>
6. Selanjutnya simpan template dan lihat hasilnya.
Demikian tutorial cara memberi nomor komentar dengan gambar pada blog
apabila ada cara yang kurang di mengerti dapat di tanyakkan di kotak komentar.
Semoga infonya bermanfaat.