Disini saya akan membahas cara membuat background kotak komentar dengan menggunakan CSS3, seperti kotak komentar blog saya....
Seperti biasa Login ke Blogger
Klik Rancangan → Edit HTML
Klik tulisan Download Template Lengkap
Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
Beri tanda centang pada kotak di samping tulisan Expand Template Widget
Lalu cari kode : ]]></b:skin>
Tips : Untuk mempercepat pencarian sobat bisa gunakan tombol Ctrl + F atau (F3)
Jika sudah ketemu, Copy kode berikut dan Paste di atas kode ]]></b:skin>
#kotak_komentar{
background: url(http://i1094.photobucket.com/albums/i447/kang-da2ng/web/background.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://i1094.photobucket.com/albums/i447/kang-da2ng/web/background_hover.gif);
-webkit-box-shadow: 2px 2px 20px #cc40fb;
-moz-box-shadow: 2px 2px 20px #cc40fb;
}
-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>
Lebih Jelasnya Seperti berikut :
<div id='kotak_komentar'>
<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>
</div>
Keterangan : ganti kode yang berwarna Hijau sesuai dengan Template sobat.
jika sudah selesai SIMPAN TEMPLATE dan lihat hasilnya
Selamat mencoba
Search This Blog
Langganan:
Posting Komentar (Atom)
CSS
Cyber RackaLs
Energy Saving Mode using CSS3
Move your mouse to go back to the page!
Gerakkan mouse anda dan silahkan nikmati kembali posting kami!
Original design by: Cyber-rackals.blogspot.com - Antonrackals.cc.cc - © Agustus 2009 - 2011
FB Comments
country
What's Awesome?
- FULL hack masi hangat
- Menghilangkan Tulisan "Langgan: Entri (Atom)"
- Dropdown Changer Background
- Menambah Headline News di blogspot
- Wallhack D3D Menu 20082011
- corel-draw-x5-portable
- Menambahkan Tag Cloud Non-animasi Dengan Gadget Blogger
- Windows Media Player 12 2008
- UPDATE | Your Uninstaller Pro v7.3.2011.02 - Full Keygen
- Membuat Link Pelangi
Feedjit
Explore the Archhves
Cyber-RackaLs.blogspot.com
Lates Comments
Labels
- Cheat Game Fb (1)
- Cheat Game Pc (3)
- Cheat PointBlank (3)
- Sofware (5)
- Tips (9)
- Tutor Blog (8)
Post a Comment