SELAMAT DATANG DI GOGONITY BLOG SEMOGA ARTIKEL-ARTIKEL DI DALAM BLOG INI BISA BERGUNA BAGI PARA PENGUNJUNG

Cara membuat background komentar dengan gambar animasi

Agar blog kita tampak lebih cool ada baiknya kita memberi sedikit pernak-pernik di dalamnya, salah satunya adalah memberi background pada kotak komentar. Saat melihat komentar di blog saya, ada sobat yang bertanya begini :
oiya bagaimana cara mengganti background form komentar kayak jadi bintang kerlap-kerlip begini sob??
Langsung saja saya membuat postingan ini.


Langkah-langkah membuat backgroundnya sebagai berikut :
1. Login ke Blogger
2. Klik Rancangan > Edit HTML
3. Jangan lupa klik tulisan Download Template Lengkap ( untuk menghindari hal-hal yang tidak diinginkan )
4. Beri tanda centang pada tulisan Expand Template Widget
5. Lalu cari kode ]]></b:skin> gunakan tombol Ctrl + F atau (F3) untuk mempercepat pencarian
6. Jika sudah ketemu, Copy kode berikut dan Letakkan di atas kode tersebut

#kotak_komentar{
background: url(http://i1013.photobucket.com/albums/af256/iroelst/green_plants.jpg) ;
padding:20px;
width:530px;
height:250px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-webkit-box-shadow: 2px 2px 4px #8bd268;
-moz-box-shadow: 2px 2px 4px #8bd268;
}

#kotak_komentar:hover{
background: url(http://i1013.photobucket.com/albums/af256/iroelst/background_hover.gif);
-webkit-box-shadow: 2px 2px 20px #cc40fb;
-moz-box-shadow: 2px 2px 20px #cc40fb;
}


7. Kemudian scroll ke bawah dan cari kode seperti berikut :

<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>

Jika sudah ketemu letakkan kode berikut diatasnya

<div id='kotak_komentar'>

Dan kode berikut dibawahnya

</div>

Keterangan : ganti kode yang berwarna biru sesuai dengan Template sobat.
Kemudian SIMPAN TEMPLATE dan lihat hasilnya

Selamat mencoba....!!!



Article :


Preview on Feedage: gogonity-blog Add to My Yahoo! Gogonity Blog Add to Google! Gogonity Blog Add to AOL! Gogonity Blog
Add to MSN Gogonity Blog Subscribe in NewsGator Online Gogonity Blog Add to Netvibes Gogonity Blog Subscribe in Pakeflakes Gogonity Blog
Subscribe in Bloglines Gogonity Blog Add to Alesti RSS Reader Gogonity Blog Add to Feedage.com Groups Gogonity Blog Add to Windows Live Gogonity Blog
iPing-it Gogonity Blog Add to Feedage RSS Alerts Gogonity Blog Add To Fwicki Gogonity Blog Add to Spoken to You Gogonity Blog

Share |

Baca juga artikel yang lain :

Bagi pengguna facebook komentar disini

4 comments:

pupuk organik said...

trims gan http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif

amin hunt blog said...

koq gak ketemu kode nya man.......


aduh piye iki......

iroelst said...

@amin hunt blog kode yang mana sob

mikoblogspot said...

Gan ?
mau jadi partner blog gak ?

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment

Terima kasih atas kunjungannya.
Dapatkan backlink gratis dari blog DOFOLLOW ini dengan berkomentar! dan gunakan kode smiley diatas untuk mengexpresikan senyum anda. contoh :))
Maaf SPAM akan Dihapus
Contoh SPAM : Mengetik Link Pada Komentar, Komentar tidak sesuai Isi Artikel,No Porno, No Sara.

Gogonity Blog © 2010 Template Modified by:
IroelSt
Protected by Copyscape Duplicate Content Finder DMCA.com