Cara Membuat Kotak Komentar Berbeda Warna Untuk Admin di Blogspot

Advertisemen
Sering saya jumpai pada saat blogwalking saya kadang bingung sendiri, mana komentar yang punya blog (admin) dan mana komentar pengunjung. Nahh karna hal itu kali ini saya akan bahas tentang bagaimana cara membuat kotak komentar untuk admin, itu berbeda dengan yang lainnya. ini akan mempermudah bagi pengunjung untuk membedakan mana admin mana user/pengunjung yang berkomentar. padahal saya sendiri juga belum memasangnya.. hihihi.. yawdah kalo begitu mari kita pasang bareng-bareng.

Lihat Gambar

Ikuti langkah-langkah berikut ini :

1. Login ke Blogger
2. klik Tata Letak dan pilih Edit HTML
3. Kalau sudah, klik Expand Template Widget
4. Lalu cari kode berikut (Ctrl + F)

]]></b:skin> atau ]]</b:skin>

5. Copy paste-kan kode di bawah ini persis berada di atas kode di tersebut :

.comment-body-author {
background: #F2F2F2;
border:1px dotted #000000;
margin:0;
padding:0 0 0 20px;
}

Keterangan :
Tulisan berwarna merah adalah warna background kotak komentar sobat (admin), sedangkan tulisan yang berwarna biru adalah garis border kotak komentar sobat (admin).
Neh buat membantu sobat bilan bingung untuk memnentukan warna klick disini

6. Maih lanjut neh, selanjutnya carilah kode beriku ini :

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

Dan jikalau kode tersebut tidah ada bisa juga dengan kode ini :

<dl id='comments-block'>

Perhatikan kode berikut :

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
<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 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='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>

7. Sobat bisa melihat kode yang berwarna biru pada script diatas, itu merupakan kode tambahan dan yang berwarna hitam itu adalah kode aslinya, sobat hanya perlu copy paste dan masukkan kode yang berwana biru tersebut persis diantara kode yang berwarna hitam di atas.
8. Jika sudah, klick simpan, dan lihatlah hasilnya.

Semoga bermanfaat.
Advertisemen

Disclaimer: Gambar, artikel ataupun video yang ada di web ini terkadang berasal dari berbagai sumber media lain. Hak Cipta sepenuhnya dipegang oleh sumber tersebut. Jika ada masalah terkait hal ini, Anda dapat menghubungi kami disini.
Related Posts
Disqus Comments