Modifikasi Kotak Komentar Blogger

2/12/2011 Blogger Dsain Template dsign template Tips Trik Blog Tutorial Blogger
Pada kesempatan pagi yang cerah ini saya sebelum brangkat kerja menyempatkan diri untuk menjawab salah satu pertanyaan sahabat dekat saya yaitu Seri Bahasa. Yang isi pertanyaannya :

gimana mahu buat kotak komentar seperti ini sob ada b/groundnya.


Dengan pertanyaan itulah saya membuat postingan ini yang berjudul Modifikasi Kotak Komentar Blogger. Selain untuk menjawab pertanyaan seri tadi mudah-mudahan tips atau postingan ini juga dapat bermanfaat bagi sobat-sobat yang lain.

Baik jika para sobat pingin liat seperti apa screenshotnya seperti di bawah ini :



Baik berhubung waktu sudah semakin siang kita lagsung aja ke langkah-langkah cara pembuatannya :

  1. Seperti biasa Sobat LogIn ke blog masing-masing
  2. Klik Rancangan --> Edit HTML
  3. Beri tanda chacklist pada tulisan "Expand Template Widget"
  4. Cari Kode berikut :

    <div class='comment-form'>


  5. Setelah ketemu ganti kode tersebut dengan kode seperti ini

    <div id='ib-form'>


  6. Kemudian tambahkan kode berikut di atas kode ]]></b:skin>


    #ib-form iframe{
    background:#ffffff url(http://i649.photobucket.com/albums/uu217/teaade/backroundpos.gif) no-repeat bottom right;
    border:7px solid #C7C7C7;
    padding:5px;
    font:normal 12pt "ms sans serif", Arial;
    color:#7EB2AC;
    width:95%;height:250px;}
    #ib-form iframe:hover{
    background:#ffffff url(http://i649.photobucket.com/albums/uu217/teaade/backroundpos.gif) no-repeat bottom right;
    border:7px solid #7EB2AC;}
    #ib-form a{
    color:#7EB2AC;}


  7. Setelah semua langkah-langkah di atas selesai klik tombol Save. dan lihat hasilnya

    Semoga bermanfaat



    KOMENTAR ANDA SANGAT BERMANFAAT BAGI PERKEMBANGAN BLOG INI

Artikel Terkait

Previous
Next Post »
Penulisan markup di komentar
  • Untuk menulis huruf bold silahkan gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic silahkan gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline silahkan gunakan <u></u>.
  • Untuk menulis huruf strikethrought silahkan gunakan <strike></strike>.
  • Untuk menulis kode HTML silahkan gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silahkan parse dulu kodenya pada kotak parser di bawah ini.

Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

49 comments

trims sob diatas tutorialnya. seri modified berapa kode tersebut dan caranya seri rasa lebih senang dan kode tersebut pasang di:

.comment-form{

background:#ffffff url(http://i649.photobucket.com/albums/uu217/teaade/backroundpos.gif) no-repeat bottom right;
border:7px solid #C7C7C7;
margin:2px;
padding-left:10px;
width:94%;height:280px;
#ib-form iframe:hover
}

lihat hasilnya disini: http://mp3zoneorg.blogspot.com/2010/12/koleksi-pantun-pengantin.html

Balas

mas bisa mengganti tulisan anonymous menjadi nama yang lain seperti "si ini atau si itu" ?
kalau bisa ditunggu sharingnya

Balas

Gak bisa sob soalnya itumah orang yang berkomentar kepada kita tidak pake Nama dan URL nya hanya berbentuk Anonim.

Balas

gan kode div class='comment-form' tempat saya gx da :((
gmn donk solusinya

kunjungin blog saya n komentar trserah dmn aja y gan untuk solusinya:o
:l lg bingung ni

Balas
This comment has been removed by the author.

Gan mu tanya koq yang ane g berubah kenapa ya Gan???

Balas

bener k bagus sekali .. terimakasih ya.

Balas

Hatur nuhun kang Tutornya Ijin Copas untk pengingat saya jika lupa.... mangga atuh di antos ka sumpingan na di kampungcibodas.blogspot.com sakantenan disuhunkeun saran na...wassalam...

Balas

Trimakasi tutorialnya, saya mencoba sekali, dan langsung jadi...

Balas

Gan Kasih Tutorial yang Lainnya Dong

Balas

@Klik menarik OK nanti kita posting lagi. Untuk sementara belum sempat sob

Balas

im looking for a referens for targeting comment form.... nice info gan

Balas

makasih tutorialnya ea sob..saya sudah mencobanya, sukses,,klo pasang icon share fb/twitter ada gak nih caranya..hehehe.. (www.venomia.blogspot.com)

Balas

makasih tutorialnya ea sob..saya sudah mencobanya, sukses,,klo pasang icon share fb/twitter ada gak nih caranya..hehehe.. (www.venomia.blogspot.com)

Balas

bagus pelu di tingkatkan lagi agar saya yang pemula bisa belajar lebih giat lagi salam

Balas

askum makasih banyaak smg blog ini banyk dikunjungi oleh sobat blogger baru sangattt bermanpaat............

Balas

@Andre krx Terimakasih juga Gan dah berkunjung di blog sederhana ini, moga blog ini makin bermanfaaat.

Balas

thanx bgt sangat bermanfaat

Balas

thanks atas infonya,,, Berkunjung balik ya Download Film Gratis | High Quality - Boxsoffice:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o:o

Balas

saya masih belum faham cari2 kode nya..lokasinya susah.. bisa + gambar spy tdk keliru ..takutnya tidak tampil lagi blog nya .. he he he

Balas

sdh behasil buat kotak komen ... mau ganti ukurannya atau bacround nya... d tunggu postingan nya.. sepertinya juga perlu...?

oh ya ... juga perlu d share kan cara buat kotak tulisan komentar yang muncul.

Balas

@Dana Islauna Untuk Ukuran Background silahkan cari gambar background yg dimiliki kemudian sesuaikan ukurannya

Balas

Kang blog sya malah jadi rusak,
daftar listnya ga bisa di klik ..
trus teksnya ga bisa diblog juga
tolong di cek ya kang

http://citrabangsa-rohis.blogspot.com

makasih ..

Balas

@ROHIS SMK Citra Bangsa Mungkin Itu ada kesalahan peletakkan kode sob, terus untuk widget itu mohon di atur ukurannya biar enak di lihat hehe.

Balas

tolong dilihat kotak komentar di entri "download software free" ... masih ada gambarnya di sana ...

juga klw sebelumnya ... tulisan balas itu tidak ada ... yg benar menggunakan pictur gambar bertuliskan "Reply" yaitu berupa ikon dan letaknya disebelah kanan ,,, bukan di bawah seperti sekarng yg tampil ..THX

Balas

sob. tlg kasih cara agar semua format komentar saya seperti ini..karena formatnya sekarang sdh acakan tdk seperti sebelumnya...

sebenarnya format komentar saya ada picturenya juga .. ada ikon Reply .. tetapi sekarang berubah sendiri seperti terlihat..

Balas

@islauna Waduuuh kalau sudah acak2an nolonginnya susah PAK, coba aja kode2 yg Bpk masukkin hapus mungkin masih ingat, kalau menurut saya itu hanya salah dalam peletakkan kode doang.

Balas

@Kang Fatur

acaka-acakan sih tidak ... maksudnya di sini ... kan sdh banyak dimodifikasi ... jadi mau d ganti seperti yg punya sob.. jadi lebih keren...

klw panduan dari sob .. kan html semulanya masih asli ... jadi mudah diikuti ...

atau kasih saya panduan ditulis aja di word klw bisa...send e-mail.

misalnya uraian untuk bikin pesan komentarnya dengan scroll .. (pesan komentar blog saya belum scroll)

terima kasih ..

Balas

sepertinya hal ini terjadi karena saya memakai HTML yang di buatkan oleh "Blogger" ... dan HTML tersebut mungkin sdh diubahnya .. Apakah bisa seperti itu?

Balas

@islauna OKE sekarang coba Bpak kode modifikasi komentarnya hapus semua, (seperti keadaan sebelumnya) kalau sudah nanti Insya Allah saya buatkan cara2seperti yg punya saya

Balas

@Kang Fatur

sob.. sedang sakit ya..?turut prihatin..d tunggu jawaban nya..tentang scroll kotak komentar

Balas

assss...
kang aku tunggu kunjungan baliknya....

Balas

gan ukuran nya bisa di ganti kan..
soal nya comment saya lebih besar.

Balas

@Software Bisa SOB, Paling nanti sobat harus Ganti Gambarnya , sesuaikan dengan Blog Sobat OK.

Balas

makasih gan udah berbagiilmunya .
nice

Balas

kunjungN AOB.. JngN LUPA follow blog saya

Balas

mantap brow infonya, nambah ilmu Thanks y
mampir yy www.terapiotak.com

Balas