Tutorial Mempercantik Kolom Kotak Komentar

Bismillahirrohmanirrokhim ..

Selamat malam sob .. malam minggu yg sangat melelahkan .. fiuh ... ambil nafaaaaaas .. fiiiiiiuh .. hmm ..

"Tutorial Mempercantik Kolom Kotak Komentar" ini akan saya posting untuk sobat sobat yg membutuhkan . fungsinya adalah untuk memperindah bagian dari blogspot kita, Khususnya di bagian kolom komentar selain itu juga untuk mempermudah kita membaca komentar" dari pengunjung blog, dikarenakan kolom kotak komentar akan terlihat rapi ..

Artikel ini saya peroleh dari hasil saya berkunjung ke blog sahabat .. OK, bila sobat ingin memperoleh Tutor lengkap tentang Blogspot silakan kunjungi di sini atau di sini ...

"Tutorial Mempercantik Kolom Kotak Komentar"

1. Login ke Blogger ==> Dasbor ==> Template ==> Edit HTML ==> Lanjutkan dan centang kotakan kecil di atas ..

2. Cari code ]]></b:skin> [gunakan F3 untuk mempermudah pencariannya]

3. Bila sudah ketemu silakan masukkan kode di bawah ini, tepat di atas code  ]]></b:skin>

Untuk melihat file Click Spoiler

/*-------------------------------------------------------------- Kustomisasi Kolom Komentar Blogspot Oleh: Semar Bingung Blog: http://eltelu.blogspot.com/ --------------------------------------------------------------*/ .comments { padding: 4px; background: #eeeeee; border: 1px solid #999999; -moz-border-radius: 5px 5px 5px 5px; } .comments-content .comment-thread { padding: 4px; background: #ffffff; border: 1px solid #cccccc; } .comments .comments-content .comment { margin-bottom: 0px; padding-bottom: 0px; } .comments .comments-content .comment:first-child { padding-top: 0px; } .comments .avatar-image-container { height: 36px; padding-left: 4px; background: #ffffff; border: 1px solid #cccccc; -moz-border-radius: 3px 3px 3px 3px; } .comments .comment-block { padding-top: 4px; padding-bottom: 8px; padding-left: 4px; padding-right: 4px; background: #fcfcfc; border: 1px solid #cccccc; -moz-border-radius: 3px 3px 3px 3px; } .comments .comments-content .inline-thread { border: 1px solid #cccccc; -moz-border-radius: 3px 3px 3px 3px; } .comments .comments-content .comment-replies { margin-left: 48px; } .comments .comment .comment-actions a { margin-right: 4px; padding: 2px; background: #f3f3f3; border: 1px solid #cccccc; -moz-border-radius: 3px 3px 3px 3px; } .comments .continue a { padding: 2px; background: #f3f3f3; border: 1px solid #cccccc; } .comments .comments-content .datetime { float: right; margin-right: 4px; } .comments .comments-content .icon.blog-author { float: right; margin-right: 3px; } .comment-form { max-width: 100%; width: 100%; }

4. Click prantinjau untuk melihat apakah ada code yg error, bila tidak ada code yg error silakan Click simpan template .. dan lihat hasilnya ..

Semoga artikel ini bermanfaat untuk kita semua ..

dan semoga Rahmat serta Hidatah-NYA sellau tercurah untuk kita semua .. amin ..

Sumber : http://eltelu.blogspot.com