Cara Singkat Me-Modifikasi Kotak Komentar/Comment Form


Cara Memodifikasi Kotak Komentar


Jika anda kurang menyukai kotak komentar bawaan asli dari blogger,saya jamin dalam waktu kurang dari 5 [lima] menit,anda sudah bisa memodifikasinya form komentar tersebut sendiri.

Sebenarnya,tanpa postingan ‘langkah untuk memodifikasi kotak komentar’ di blog tutorial kali ini,jika anda browse di google.com saja sudah banyak bermunculan artikel tentang cara singkat memodifikasi kotak komentar/comments form tersebut.

Hanya saja, disini saya akan sharing langkah cara mengganti/mem-vermak kotak komentar hanya dengan satu jurus saja.

Langkahnya cukup mudah,saya akan ambil contoh dari salah satu template bawaan blogger.
Pertama anda pergilah ke Dashboard»Tata Letak»Edit Html.
Cari kode dalam barisan css anda,yang hampir sama seperti berikut (mengingat template yang berbeda-beda):
/* 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;
}
Jika sudah ketemu,tinggal hapus kode tersebut,dan gantilah 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;
}
Kode yang bercetak tebal diatas "#B4F4FF" adalah warna block dari header masing-masing komentar,jadi rubahlah sesuai dengan keinginan anda.Bisa anda ganti dengan tulisan black,white,red,blue,dll.
Bisa juga anda menggunakan kode heksa warna di http://id.wikipedia.org/wiki/Daftar_warna untuk memodifikasi warnanya.


posted by rifat in blog tutorial

Baca juga Software Akuntansi Laporan Keuangan Terbaik - Century 21 Broker Properti Jual Beli Sewa Rumah Indonesia


2 comments:

Indahnya Berbagi on 9 Mei 2010 pukul 00.09 mengatakan...

makasih tutorialnya!

Kalau cara memodifikasi formulir komentar atau kolom komentar blogger lihat disini ya

febriyanto on 22 Juni 2010 pukul 14.30 mengatakan...

mantep.. langsung saya praktekkan... hhe

Posting Komentar

 

Site Info

Followers

Copyrights © 2010 RifatSoftware Support Berita Teknologi Blog RifatView Blog SEO RifatView
Also Supported SEO Contest
Ultrabook Notebook Tipis Harga Murah Terbaik - Software Akuntansi Laporan Keuangan Terbaik
Jual RPP dan Silabus - Promo Member Alfamart Minimarket Lokal Terbaik Indonesia
Informasi Kredit Terbaik di Indonesia - Sepeda Motor Injeksi Irit Harga Terbaik Cuma Honda