Membedakan tampilan komentar pemilik dengan pengujung atau istilah kren-nya Author Comment Highlight tentu akan mempermudah pengunjung lain untuk melihat mana komentar dari pengunjung blog dan mana komentar pemilik blog.
Tanpa banyak cuap-cuap langsung aja ya ketahap pembuatannya?
Pertama:
Masuk pada Template -> Edit HTML -> jangan lupa beri tanda centang pada Expand Template Widget
cari kode <dd class=’comment-body’> atau lihat arahan kode warna hijau dibawah ini, jika sudah ketemu kode <dd class=’comment-body’> tambahkan kode dengan warna merah di atas kode tersebut. kemudian tambahkan juga kode </b:if> seperti tampak pada kode dibawah.
<dl id=’comments-block’>
<b:loop values=’data:post.comments’ var=’comment’>
<b:if cond=’data:comment.author == data:post.author’>
<dt class=’owner-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/>
</dt>
<b:else/>
<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/>
</dt>
</b:if><b:if cond=’data:comment.author == data:post.author’>
<dd class=’owner-Body’>
<p><data:comment.body/></p>
</dd>
<b:else/>
<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>
</b:if><b:if cond=’data:comment.author == data:post.author’>
<dd class=’owner-Footer’>
<span class=’comment-timestamp’>
<a expr:href=’”#comment-” + data:comment.id’ title=’comment permalink’>
<data:comment.timestamp/>
</a>
<b:include data=’comment’ name=’commentDeleteIcon’/>
</span>
</dd>
<b:else/>
Kemudian tambahkan kode CSS dibawah ini
Cari kode dengan warna hijau, jika sudah ketemu tambahkan kode dengan warna merah dibawahnya.
#comments-block .comment-body p {
margin:0 0 .75em;
background:#f3f3f3 no-repeat left bottom;
}
.owner-Body {
margin:0;
padding:0 0 0 20px;
}
.owner-Body p {
font-size:100%;
margin:0 0 .2em 0;
color:#FF0000;
text-decoration:bold;
}
Selamat mencoba..ups hampir lupa ucapan terima kasih buat mas anang yang menulis lebih dulu tutorial ini.
Dengan memasukan alamat email dibawah ini berarti anda akan mendapat kiriman artikel terbaru dari o-om.com di inbox anda:
Beri vote untuk nilai artikel ini:


14 Komentar:
Ah, jadi pertamax nih ceritanya. :D Thanks Om, langsung diaplikasikan ilmunya. Salam hangat...
@ecko : wah jarang2 nih mas ecko jadi pertamax...ya udah om premium hihi
Kereeen..ditunggu ya hack blogger selanjutnya...
@abi : OK silahkan ikuti terus perkembangan di blog om :)
udah lama saya nyari tips ini Om, Koq baru ketemu sekarang ya? Thanks Om.
@feri : thanks juga feri dan silahkan dicoba
Duh om, saya sudah pernah buat kolom komentar dari tutorial kang rohman, tp tidak berwarna.
Udah seneng2 nemu tips ini. Tp gabisa digunakan katanya kode xml tidak benar..
Kayanya formatnya beradu ya?
huhuhuuu.....
@bani : mungkin ada kesalahan waktu copy paste kodenya..atau templatenya sudah di modifikasi..dicoba dulu ya...
saia coba kok rada susah yah om...
ada apa gerangan.....
numpang absen dulu aja yah om.. :D
wah kotak komentarnya baru ya om, kapan dibuatkan tutorialna nieh
ini dia yang dicari-cari
tak cobain dulu ahh... :))
#comments-block .comment-body p {
margin:0 0 .75em;
background:#f3f3f3 no-repeat left bottom;
}
oom kok yg ini punyaku g ada ya..???
(bantuin o-om ahh.., tapi sori kok, kalo salah ntar di koreksi ya)
@Kang Noval..
#comments-block .comment-body p {
margin:0 0 .75em;
background:#f3f3f3 no-repeat left bottom;
}
Ini gak mesti sama... tergantung templates
(soalnya punya saya juga beda, he..he.. yang penting cari aja kode CSS buat BODY komentar)
om, apa bedanya code css di atas antara owner-body dengan owner-body p
kalo saya hapus salah satu boleh gak om?
Sudah bergabung dengan program penghasil Dollar($)?
Posting sebuah Komentar
Untuk memasang emoticon diatas, cukup dengan menulis kodenya. Silahkan berkomentar, jangan nyepam ya :)