Cara Memberikan Highlight pada Komentar Penulis di Blogspot

Memberikan highlight pada komentar penulis di blog Anda dapat membuat komentar pemilik blog terlihat berbeda dari komentar pengunjung. Ini adalah tips hack Blogger yang sangat berguna dan menarik. Anda bisa melihat contohnya di blog saya. Berikut adalah langkah-langkah untuk membuat efek "Highlight Author Comment" di Blogspot.

Langkah-Langkah:

Masuk ke Blogger:
- Pilih menu "Layout --> Edit HTML". Jangan lupa untuk mencadangkan template Anda terlebih dahulu.
Perluas Widget Template:
- Centang kotak "Expand Widget Templates".

Tambahkan Script CSS:

Salin script berikut ini dan tempelkan sebelum kode ]]></b:skin> atau di area CSS Anda.

css
.comment-body-author {
    background: #E6E6E6; /* Warna latar belakang */
    color: #000; /* Warna teks */
    border-top: 1px dotted #223344;
    border-bottom: 1px dotted #223344;
    border-left: 1px dotted #223344;
    border-right: 1px dotted #223344;
    margin: 0;
    padding: 0 0 0 20px; /* Posisi */
}

Cari Kode Komentar:

Temukan kode berikut:

html
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<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>
said...
</dt>

Tambahkan Kode untuk Highlight Komentar Penulis:

Tambahkan kode berikut ini setelah said...:

html
<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>

Sehingga kode lengkapnya menjadi seperti ini:

html
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<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>
said...
<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<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>
<dd class='comment-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:loop>
</dl>

Simpan Template:
- Setelah selesai, simpan perubahan pada template Anda.
Komentar:
- Pastikan Anda sudah login ke akun Blogger Anda sebelum memberikan komentar untuk memastikan efek highlight berfungsi.

Kesimpulan

Dengan mengikuti langkah-langkah di atas, Anda dapat memberikan highlight pada komentar penulis di blog Anda, membuatnya terlihat berbeda dan lebih menarik dibandingkan komentar pengunjung. Ini tidak hanya meningkatkan estetika blog Anda tetapi juga membantu pembaca dengan mudah mengidentifikasi komentar dari pemilik blog. Selamat mencoba dan semoga berhasil!

Selamat Mencoba!

Ruli Lesmana