Memperindah Kotak Comment Blogger/Blogspot Dengan CSS
Akhirnya kita menggunakan konsep frame untuk menghias sekeliling kotak comment tersebut. Caranya pun sangat sederhana dan mudah. Berikut langkah-langkah dan kodenya:
1. Masuk ke dashboard Blogger => Design => Edit HTML/Edit Template
2. Jangan lupa backup dulu template yang lama untuk berjaga-jaga apabila ada kesalahan dalam editing.
3. Centang expand widget template di sebelah kanan.
4. Cari kode => ]]></b:skin> (Gunakan Ctrl+F untuk mencari)
5.Copy kode CSS dibawah ini dan letakkan tepat sebelum/diatas tag tersebut.
#comment-form iframe{6. Setelah itu save dan coba dilihat hasilnya.
background:#7f9db9;
border:7px solid #eeeeee;
padding:5px;
font:normal 12pt "ms sans serif", Arial;
color:#000000;
width:95%;
height:250px;
}
#comment-form iframe:hover{
background:#7f9db9;
border:7px solid #bababa;
}
Ganti width dan height sesuai dengan ukuran yang anda inginkan. Begitu pula dengan warna, ganti kode background sesuai dengan keinginan. Untuk kode-kode warna, silakan lihat Hex Color Code Chart Generator.
Memperindah Kotak Comment Blogger/Blogspot Dengan CSS
Written by: Ahmad Khoirul Azmi
Thanks for reading! Suka dengan artikel ini? Please link back artikel ini dengan codedi bawah atau share dengan sharing buttons di atas. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.
Written by: Ahmad Khoirul Azmi
Thanks for reading! Suka dengan artikel ini? Please link back artikel ini dengan codedi bawah atau share dengan sharing buttons di atas. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.
Author:
Saya suka dengan CSS..
Koreksi nih boss,
pada bagian: background:#7f9db9 url() no-repeat bottom right;
yang saya cetak tebal seharusnya ngga usah ditulis. Karena tidak ada URL image di sana. Jadi biarkan penulisannya
background:#7f9db9;
BTW, I love this Post :-)
wuitz bener juga yah....stelah beneran tak coba di template lain juga ga ngefek tu. oke deh, segera update n edit posting nih. thanks om SM ^^
bang nanya dong biar ada tambahan anonym di comment nya gimana ya?? saya masih newbie nih XD
masuk ke settings/pengaturan > comments > who can comment > pilih opsi di bagian paling atas (anyone/siapa saja) > save.
cara mengganti warna tulisan komentar admin kayak om ini gmn ya? warna tulisan adminnya beda dengan warna tulisan commenter yang laen
itu dengan menambahkan elemen div baru pada widget komen. kemudian membuat aturan CSSnya. Nanti, secepatnya akan saya buat postingnya aja bro, soalnya panjang.
Punya anda adalah template yang sangat lama. CSS utama tidak dimasukkan di dalam b:skin. Coba dengan cara ini:
Tambahkan <style type="text/css"> di atas kode dan </style> di bawah kode, jadinya:
<style type="text/css">
#comment-form iframe{
background:#7f9db9;
border:7px solid #eeeeee;
padding:5px;
font:normal 12pt "ms sans serif", Arial;
color:#000000;
width:95%;
height:250px;
}
#comment-form iframe:hover{
background:#7f9db9;
border:7px solid #bababa;
}
</style>
Lalu cari </head> dan masukkan kode TEPAT di atas-nya / sebelum-nya.
bgaimana cara membuat Menu/Navigation seperti punyanya k.Ahmad ??
ijin sedot gan. . .
gampang-gampang susah ya :)
siiippp.....mantap gan
mas cara buat avatar seperti diblog ini bagaimana ?
bng :D gambar ayam nya lucu hahahaah :D saya terbhak2 ternyata temannya uda di goreng :D kasihan si ayam
Tips tersebut di atas sudah saya terapkan, tapi mengapa tidak ada perubahan alias tidak muncul ya?
Btw, saya coba dengan yang jawaban sobat (yang disimpan di atas kode head). Namun hasilnya sama, tidak ada perubahan sob.
Mohon bantuan & pencerahannya...
ﺸﻜﺮﺍﻜﺜﻴﺮﺍﺠﺰﻜﻢﺍﷲﺨﻴﺮﺍﻜﺜﻴﺮﺍ atas perhatian serta kesediaan sobat...
manteb gan css nya,,,
thx.. info ny..
Post a Comment