Cara Modifikasi Tampilan Kotak Komentar

Tutorial kali ini akan membahas bagaimana merubah tampilan kotak komentar blog anda. jika kotak komentar anda terlihat rapi dan menarik maka pengunjung akan selalu meluangkan waktunya untuk berkomentar di postingan anda. kali ini saya akan memberitahu Cara Modifikasi Tampilan  Kotak Komentar yang simpel.

Tampilannya Akan Seperti gambar Di Bawah Ini:

1. Masuk Ke Rancangan>> Edit HTML

2. Cari kode yang mirip dengan kode di bawah ini

/* Comments
----------------------------------------------- */
#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.2em;
color: $dateHeaderColor;
font: bold 78% Georgia Serif;
}
#comments h4 strong {
font-size:130%;
}
#comments-block {
margin:1em 0 1.5em;
line-height:1.4em;
}
#comments-block dt {
margin:.5em 0;
}
#comments-block dd {
margin:.25em 20px 0;
}
#comments-block dd.comment-timestamp {
margin:-.25em 20px 1.5em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}
#comments-block dd p {
margin:0 0 .75em;
}
.deleted-comment {
font-style:italic;
color:gray;
}

 3. Ganti kode diatas dengan kode dibawah ini:

#comments h4 {
color:#666666;
font-weight:bold;
letter-spacing:0.2em;
line-height:1.4em;
margin:1em 0;
text-transform:none;
}
#comments-block {
line-height:1.6em;
margin:1em 0 1.5em;
}
#comments-block .comment-author {
background:#B4F4FF none repeat scroll 0 0;
border:1px solid #B4F4FF;
font-size:15px;
font-weight:bold;
margin-right:20px;
padding:5px;
}
#comments .blogger-comment-icon, .blogger-comment-icon {
background:#EEEEEE none repeat scroll 0 0;
border-color:#CCCCCC #CCCCCC #EEEEEE;
border-style:solid;
border-width:2px 1px 1px;
line-height:16px;
padding:5px;
}
#comments-block .comment-body {
border-left:1px solid #EEEEEE;
border-right:1px solid #EEEEEE;
margin-left:0;
margin-right:20px;
padding:7px;
}
#comments-block .comment-footer {
border-bottom:1px solid #EEEEEE;
border-left:1px solid #EEEEEE;
border-right:1px solid #EEEEEE;
font-size:11px;
line-height:1.4em;
margin:-0.25em 20px 2em 0;
padding:5px;
text-transform:none;
}
#comments-block .comment-body p {
margin:0 0 0.75em;
}
.deleted-comment {
color:gray;
font-style:italic;
}

4. Kode yang bercetak tebal diatas "#B4F4FF" adalah warna block dari header masing-masing komentar, jadi rubahlah sesuai dengan keinginan anda.

5. Kemudian Simpan Dan Lihat Hasilnya