Sudah lama rasanya saya update lagi di blog.
Sekarang trick baru sudah datang...trick ini saya dapatkan dari blognya tipsandcara.
kenapa dikatakan trick baru?Trick baru ini sangatlah jarang di artikel blog yang lain.
Contoh penggunaan trick baru ini seperti berikut :
Untuk Cara menggunakan trick ini sederhana saja ;
- Masuk ke blog anda
- Klik Tata Letak
- Kemudian klik tab Edit Html, jangan lupa ceklist kotak kecil "expand widget templates".
- Cari kode berikut :
<dl id= 'comment-block'> - selanjutnya ganti kode html template anda seperti dibawah ini
<b:includable id='comments' var='post'>
........
<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='comment-number' style='float: right; font-size: 20px;'>
<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'>
.......
</dd>
</b:loop>
</dl> - Warna yang merah bisa diganti sesuai keinginan anda.
- masukan kode CSS penomoran komentar di bawah ini ke dalam template sebelum kode ]]</b:skin>
.comment-number {
float: right;
background: url(http://i40.tinypic.com/14tmp9e.jpg) no-repeat;
width:53px;
height:53px;
padding:5px 0 0 0;
margin-right: 5px;
margin-top: -20px; /*comments-counter position*/
text-align: center;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 18px;
font-weight: bold;
}
/*since the numbers are actually links, we need to force the color properties*/
.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;
} - Simpan tempate dan lihat hasilnya.....
