Wednesday, August 10, 2011

Cara Memasang Float ChatBox Di Blog

Cara Memasang Float ChatBox Di Blog - Mungkin tutorial ini sudah banyak dibahas di blog lain. Namun, tutorial kali ini memang sedikit berbeda dengan tutorial memasang float chatbox pada umumnya. Kalau biasanya, float chatbox nya menampilkan efek slide (kiri - kanan) kali ini sedikit berbeda. Efek yang ditampilkan autohide alias muncul dengan efek tersembunyi. Untuk demo mungkin gag ada, karena keterbatasan ruang. Jadi, silahkan dicoba deh, dijamin gag bakalan nyeseeeel.....

1. Login ke blogger.com
2. Pilih Rancangan --> Design --> Tambah Gadget --> HTML/ Javascript
3. Salin kode berikut ini didalamnya :
<style type="text/css">
.gb_fixed{position:fixed;
top:60px;
right:-4px;
z-index:+10;
-moz-border-radius:3px;
border-radius:3px
}
* html .gb_fixed {position:relative;}
#hidden_gb2 {display:none;
border:1.5px solid #cccccc;
-border-radius:5px;
background:#000000;
padding:10px;
padding-top:0px;
-moz-border-radius:5px;
border-radius:5px;
}
</style>

<div class="gb_fixed">
<table id="hidden_gb2" cellpadding="0" cellspacing="0">
<tr><td>
<div>
<a href="javascript:void(0)" onclick="gb_showHideGB()"><img src="http://lh4.ggpht.com/_oFXd4wU3lK8/TSQrWfZqfnI/AAAAAAAAADQ/OzM7TygiCdM/Close.png" title="Click to Close"/></a></div>


LETAKAN KODE HTML CHATBOX ANDA

<div>
<center><blink><a href=http://4-jie.blogspot.com/2011/08/cara-memasang-float-chatbox-di-blog.html' target='_blank'>Get This Widget</a></blink>
</center></div>
<center>
</center></td></tr>
</table>
</div>
<script src="http://yourjavascript.com/21261405011/cbox-bitexp.js"></script>
<div style="z-index:+5" class="gb_fixed">
<a href="javascript:void(0)" onclick="gb_showHideGB()"><img style="border:0; cursor:pointer" src="http://lh4.ggpht.com/_oFXd4wU3lK8/TTe7ZFV0vII/AAAAAAAAAD4/ZFesT6A_s2c/Chatbox.png" alt="Widget By:4-JIE" />
</a></div>

4. Save

Keterangan !
Pada tulisan LETAKAN KODE HTML CHATBOX ANDA silahkan tukar dengan kode chatbox kamu masing-masing

14 comments

yang float begini memang keren kang,, oh ya saya mau nanya nih,, gmna cara buat Tooltips sperti blog ini ??

sob, ane mau tanya cara membuat menu dengan submenuny gmna yah? please share donk. menuny persis dengan sobat ini/kayak menuny o-om :D

nice...
terimakasih atas sharenya...
ane udah terapkan...

#misi tolong follow back http://kegampangan.blogspot.com/

iya samasama, terimakasih kembali atas kunjungannya :)

@Fajri Alhadi

akhirnya ketemu juga, uda lama ane pengen buat yang kaya ginian.
thanks gan :)

Nice Share Om :D
Buat Nambah Nambah Ilmu :D

Mampir Ke Sini Juga Donk :D
http://blog-rzaal.blogspot.com/

ada yang transparansi dan multi fungsi gak??

ada lagi yang gratis gan, buatan indonesia, namanya wgchat.com
bisa integrasi dengan ym gtalk dan facebook.
cocok banget kalau dipasang diweb toko online.

ada versi gratis selamanya juga

1. Berkomentar lah dengan sopan dan santun
2. No Spam No Live link dan tidak ada Link Mati
3. Free Backlink (Dofollow) dari blog berPagerank 2 ini


EmoticonEmoticon