6/30/2010

Modifikasi Pesan Pengantar Form Kotak Komentar

Modifikasi Pesan Pengantar Form Kotak Komentar - Sobat tau pesan yang dimaksud? maksudnya adalah pesan yang tertera pada atas kotak komentar blogger. Pesan tersebut secara default tidak ada, namun Sobat bisa menambahkannya sendiri. Sebenarnya untuk menambahkan pesan tersebut (di atas kotak komentar), Sobat tidak usah melakukan penyetingan terlebih dahulu, tapi Sobat sudah bisa langsung menuliskan pesan Sobat.
Begini contoh pesan/tulisan yang bisa Sobat tambahkan (tanpa modifikasi)



Nah, gambar di atas adalah contoh tulisan/pesan yang diletakkan di atas kotak komentar tapi tidak dimodifikasi, alias biasa. Sobat bisa menggunakan tag <i> untuk italic/teks miring <b> bold/teks tebal dan <a> untuk membuat link. 
Nah, lalu bagaimana contoh pesan yang diletakkan di atas kotak komentar yang telah dimosifikasi??


Tampak perbedaan yang mencolok antara sebelum dimodifikasi dengan sudah dimodifikasi,
bagaimana tutorialnya? baca dulu artikel menarik ini (Baca : mengubah layout/background form kotak komentar )Berikut tutorial cara "Modifikasi Pesan Pengantar Form Kotak Komentar"

Pertama, kita tuliskan pesan yang akan kita letakkan di atas kotak komentar,
  • Masuk ke blogger
  • Buka Setting/Pengaturan
  • Pilih tab comment/komentar
  • Tuju pada kotak isian "Comment Form" atau "Pesan Formulir Komentar", dan isilah dengan tulisan/pesan Sobat 

Sobat bisa mengisinya dengan link, huruf miring, huruf tebal . . 
untuk link : <a href="alamat link">tulisan Sobat</a>
huruf miring : <i>tulisan Sobat</i>
huruf tebal: <b>tulisan Sobat</b>

Kedua, mulai modifikasi tulisan dengan otak-atik Edit HTML,
  • Buka desaign/rancangan
  • Buka tab Edit HTML
  • Centang Expand Template Widget
  • Cari kode <p><data:blogCommentMessage/></p> ,(gunakan Ctrl+F) dan replace/ganti dengan kode berikut,
<div id='pra-comment'><data:blogCommentMessage/></div>
  • Lalu cari kode ]]></b:skin> ,dan letakkan kode berikut di atas kode ]]></b:skin> tadi (gunakan Ctrl+F)
/*-- modifikasi pesan komentar--*/
#pra-comment{
background:#F2F2F2;
width:480px;
height:100px;
padding:10px;
font:normal 13px trebuchet ms;
text-align:justify;
border:1px solid #EFF0F1;
margin:0 10px 5px 0;
line-height: 1.8em;

#pra-comment a{ font-weight:bold;}
#pra-comment b{color: #000000;}
#pra-comment em b{Color:#ff0000;}
^Note : Ganti Width, Height, Background, text align sesuai keinginan Sobat (Baca : Kode warna Html )

Labels: