Tutorial : Cara Letak Gambar Background Comment Form.

Tutorial Time !


Kali ni kita belajar letak background image dekat comment form pula. Benda ni korang boleh buat kalau korang suka la. Kalau nak pakai classic form yang biasa pun boleh. Rasa macam nak buat ? Jom...

Background Image di Comment Form

Cute kan ?

Cara Letak Gambar Background Comment Form :

• Download full template dulu sebagai back up.
• Go to >> Edit Html >> Expands Widget Templates
• Ctrl F dan cari kod pertama  : 
• <div class='comment-form'>
• Gantikan kod pertama dengan kod kedua : 
• <div id='comment-form'>
•  Kemudian, cari kod ketiga pula : 
• ]]></b:skin>
• Copy dan Paste kod keempat di atas ]]></b:skin> :
•     #comment-form iframe{
      background:#ffffff url(http://link gambar.jpg) ;
      border:5px solid #FF66CC;
      padding:5px;
      font:normal 12pt "ms sans serif", Arial;
      color:#7EB2AC;
      width:450px;
      -moz-border-radius-topleft:8px;
      -moz-border-radius-topright:8px;
      -moz-border-radius-bottomleft:8px;
      -moz-border-radius-bottomright:8px;
      }
      #comment-form iframe:hover{
      background:#000000 url(http://link gambar.jpg);
      border:5px solid #FF66CC;
      }
      #comment-form a{
      color:#7EB2AC;
      -moz-border-radius-topleft:8px;
      -moz-border-radius-topright:8px;
      -moz-border-radius-bottomleft:8px;
      -moz-border-radius-bottomright:8px;
      }
  
• Edit kod warna merah dengan link gambar yang korang suka, dan Edit kod warna biru untuk warna border comment form korang.
• Save templates, dan Siap !

• Lihat contoh gambar untuk cara nak cari background sesuai dan copy link gambar. Korang boleh cari background menarik di Website Cherrybam.

 

Credit : Budak


Selamat Maju Jaya !


Feeling Lucky?