Mempercantik Komentar Blogspot dengan Warna Sesuai Tema

 

Sebenarnya artikel tentang “bagaimana memberi warna pada komentar blog” sudah banyak, bukannya latah atau ikut-ikutan tapi artikel ini hanya memberi “alternative choice” dalam hal “bagaimana cara dan pilihan warna yang sesuai dengan blog milik kita”. So… jika tertarik silahkan baca sampai selesai dan selamat mencoba... ;)

Beda Ladang Beda Belalang.
Setiap blog-template punya keunikan masing-masing dan dari pengalaman yang saya jumpai saat blog-walking banyak pengguna blog menggunakan template minima termasuk pada blog ini. Tapi tidak menutup kemungkinan tips ini juga berlaku untuk templates blog lain, Sebagai contoh hasil dari tips ini bisa lihat screenshoot artikel ini.
Step-By-Step mengubah warna komentar
Cara memilih Warna yang sesuai
Sebelum kita memberi warna pada komentar kita terlebih dahulu kita harus mengetahui warna-warna apa saja yang cocok di sematkan pada komentar, sebagai gambaran awal pada blog ini saya memilih 3 warna yang sesuai tema yaitu :
soft-orange (#FFFF99) : untuk warna dasar (background colour)
orange (# FFCC66): Warna text “nama user” dan
grayscale (# CCCCCC): comment footer
setelah menentukan warna komentar yang sesuai dengan blog, selanjutnya cari kode warna-warna tersebut, misalnya menggunakan foto editor (exp: photoshop), lalu jangan lupa catat kode tersebut.

Edit HTML
Login ke akun , pilih blog yang akan di edit, kemudian klik Layout → Edit HTML kemudian centang Expand Widget. Jangan lupa untuk membackup template sebelum melakukan perubahan.
Pada bagian “Comments” cari kode dibawah ini (tekan ctrl+F) :

#comments-block .comment-author {
margin:.5em 0;
}
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}

Setelah menemukan kode diatas ganti dengan kode dibawah ini, kode berwarna merah adalah kode warna yang telah dipilih sebelumnya :

#comments-block .comment-author {
background:#FFCC66; /* warna text Nama komentator */
margin:.5em 0;
padding:0 0 0 20px;
font-weight:bold;
}
#comments-block .comment-body {
background:#FFFF99; /* warna background komentar pengunjung */
margin:.25em 0 0;

}

#comments-block .comment-footer {
background:#CCCCCC; /* warna background footer komentar */
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}

Setelah selesai jangan lupa tekan Save.
Selamat…!!! Komentar pada blog kita sudah berubah warna
Tambahan : setelah hasil edit kita tersimpan maka semua komentar yang telah masuk akan berubah sesuai dengan warna yang telah dipilih sebelumnya.
Akhir kata semoga tulisan ini bermanfaat dan trims atas kunjungannya

KUMPULAN ARTIKEL SEJENIS
* Sukses Membuat “Readmore” Untuk Template Minima * Ubah Template Blogspot Standar Menjadi 3 Kolom * Membuat Menu-bar sederhana di blogspot * Mengubah ukuran (width) “posting” dan “Sidebar” *