Cara Mmebuat Warna Kotak Komentar
Maksud dari judul di atas adalah kita
akan memberi warna serta border pada kolom komentar admin sehingga
pengunjung dapat dengan mudah membedakan mana komentar admin dan mana
komentar pengunjung lain. Warna kotak komentar yang berbeda ini akan
terjadi saat kita berkomentar jika kita selaku admin blog telah sign
in di Blogger. Contohnya seperti kotak komentar admin di blog
ini yang terlihat berbeda dengan komentar lainnya.
Bila tertarik untuk
mengaplikasikan trik ini pada template blog Sobat, silakan simak
langkah-langkahnya di bawah ini.
1. Masuk ke akun Blogger Sobat.
2. Klik Rancangan
> Edit HTML.
3. Klik Download
Template Lengkap untuk berjaga-jaga kalau nanti terjadi
kesalahan kita dapat dengan mudah mengembalikan template seperti semula.
4. Beri tanda centang di Expand
Template Widget.
5. Cari kode ]]></b:skin>. Tekan Ctrl + F lalu isikan
kode untuk mempercepat pencarian.
6. Copy kode di bawah ini
lalu paste di atas kode tersebut.
.comment-body-author {
background: #fee6e6; /* Warna Background */
border:2px dotted #d31111; /*Border*/
margin:0;
padding:0 0 0 0px;
}
background: #fee6e6; /* Warna Background */
border:2px dotted #d31111; /*Border*/
margin:0;
padding:0 0 0 0px;
}
- #fee6e6 merupakan warna untuk latar belakang, silakan ganti kode warnanya untuk mengubah warnanya.
- 2px dotted #d31111 adalah border style dot dengan ketebalan 2 piksel dan berwarna #d31111. Silakan diubah sesuai keinginan Sobat.
<b:if cond='data:comment.authorUrl'>
<a
expr:href='data:comment.authorUrl' rel='nofollow'
target='_blank'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<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>
<dd
class='comment-footer'>
8. Tambahkan kode:
<b:if cond='data:comment.author ==
data:post.author'>
<dd
class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>
di
bawah kode:
<data:commentPostedByMsg/>
</dt>
dan kode </b:if> di bawah kode:
<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>
sehingga hasilnya menjadi seperti di
bawah ini.
<b:if cond='data:comment.authorUrl'>
<a
expr:href='data:comment.authorUrl' rel='nofollow'
target='_blank'><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'>
9. Klik tombol SIMPAN TEMPLATE.
Follow Me @Novi_priell
0 komentar:
Posting Komentar