Kali ini saya dapet satu lagi trik mempercantik blog membuat kolom komentar admin blog berbeda dengan komentar pengunjung, jadi setiap ada balasan komentar, background komentar balasan itu warnanya akan berbeda, tujuanya sudah tentu untuk membedakan komentar pengunjung dan admin.
Cara membuatnya ikuti langkah berikut ...
Masuk ke Blogger
Pilih tab Design
Pilih Edit HTML beri tanda centang di kotak expand widget template
Selanjutnya cari kode ]]></b:skin>.
kalau sudah ketemu, kopikan kode berikut di atas kode ]]></b:skin>.
.comment-body-author {
border: 1px solid #87CEEB;
background: #ddfeeb;
width: 500px;
margin: 10px 10px 10px 10px;
padding-left: 20px;}
Catatan : warna background dan warna garis tepi bisa di ganti sesuai dengan warna latar belakang blog kamu.border: 1px solid #87CEEB;
background: #ddfeeb;
width: 500px;
margin: 10px 10px 10px 10px;
padding-left: 20px;}
Langkah selanjutnya cari kode seperti berikut
<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 cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
Tambahkan kode berikut di atasnya
<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-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>
Dan kode ini di bawahnya
</b:if>
Sehingga menjadi seperti berikut
<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-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>
Selanjutnya simpan template kamu.
Selamat mencoba
0 komentar:
Posting Komentar