Membuat Background Kotak Komentar Lebih Menarik

Posted by Gani Mugni Sabtu, 03 Desember 2011 0 komentar
Membuat Background Kotak Komentar Lebih Menarik, dari judulnya aja udah menarik, tapi cara ini tidak terlalu sulit untuk dilakukan. Sobat blogger pasti bisa melakukannya, tujuan dari Membuat Background Kotak Komentar Lebih Menarik">membuat background kotak komentar lebih menarik adalah agar kita tidak bosan dengan tampilan kotak komentar yang putih polos.

Ada kalanya kita bosan dengan tampilan itu, tidak ada salahnya kita membuat perubahan kan, yang tentunya menjadi lebih baik. Saya baru mendapatkan komentar di potingan Cara Membuat NetworkedBlogs Followers Facebook oleh salah satu sahabat blogger saya yang katanya "mantab gan tutorialne,..bdw nek ngsih efek pada kotak komentar gmna gan...? boleh brbagi...???". Nah karena iseng-iseng saya share dech cara membuatnya.

Berikut ini screenshot nya :

Membuat Background Kotak Komentar Lebih Menarik


Add caption

Jika sobat tertarik, ikuti langkah-langkah berikut ini :
  1. Masuk ke blogger;
  2. Klik Perancangan lalu klik Elemen Laman;
  3. Klik Expand Template Widget (jangan lupa backup template sobat terlebih dahulu);
  4. Kemudian tambahkan kode CSS berikut ini diatas kode ]]></b:skin>
#comment-form iframe{
   background:#ffffff url(https://lh6.googleusercontent.com/-Q3bpBWeh_5Y/TXRkPZ34WiI/AAAAAAAABbE/8nSS6KluZqI/s1600/rumput.jpg) ;
   border:5px solid #9999FF;
   padding:5px;
   font:normal 12pt "ms sans serif", Arial;
   color:#7EB2AC;
   width:450px;
   height:230px;
   }

#comment-form iframe:hover{
   background:#000000 url(https://lh6.googleusercontent.com/-kNOFg63f2H8/TXRkdsv79OI/AAAAAAAABbI/7wZwh76L2xg/s1600/bintang.gif);
   border:7px solid #999FFF;
   }
    Jika kode tersebut telah ada, maka sobat hanya perlu memodifikasi elemen yang ada di dalamnya, saya menemukan sebagian template tidak memiliki kode tersebut. Sobat bisa merubah gambar background sesuka hati sobat.
  1. Selanjutnya sobat cari kode yang mirip seperti ini:
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src' style='display:inline'/>
<iframe class='blogger-iframe-colorize' frameborder='0' height='275' id='comment-editor' scrolling='auto' src='' width='490'/> <data:post.iframeColorizer/>
  1. Kemudian pastekan kode <div id='comment-form'> dan </div> diantara kode tadi sehingga menjadi seperti ini:
<div id='comment-form'>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src' style='display:inline'/>
<iframe class='blogger-iframe-colorize' frameborder='0' height='275' id='comment-editor' scrolling='auto' src='' width='490'/> <data:post.iframeColorizer/>
</div>
  1. Langkah terakhir adalah simpan template sobat
Semoga tutorial ini bermanfaat buat sobat blogger.

TERIMA KASIH ATAS KUNJUNGAN SAUDARA
Judul: Membuat Background Kotak Komentar Lebih Menarik
Ditulis oleh Gani Mugni
Rating Blog 5 dari 5
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi artikel ini harap menyertakan link dofollow ke http://azharadzuan.blogspot.com/2011/12/membuat-background-kotak-komentar-lebih.html. Terima kasih sudah singgah membaca artikel ini.

0 komentar:

Posting Komentar

Panduan blog dan SEO support Jual Online Baju Wanita - Original design by Bamz | Copyright of Azhara Blog.