Home » » MEMBUAT KOTAK CHAT MELAYANG

MEMBUAT KOTAK CHAT MELAYANG

Kotak chat kita pasang untuk menyambut tamu yang datang ke blog memang sebaiknya berada pada posisi yang mudah di lihat.Sehingga jika tamu yang akan memberikan pesan singkat tidak pusing-pusing mencari.
Namun demikian, ada satu hal yang perlu kita ketahui bahwa pemasangan kotak chat di halaman  blog akan mempengaruhi loading internet.Karena menurut para ahli SEO ada beberapa gadget yang sangat memberatkan sebuah blog antara lain : Google friend conect dan kotak chat/Chatbox ini.

Berdasar pada alasan di atas,maka dengan sangat berat ,kotak chat ( Buku Tamu untuk blog ini ) saya pasang melayang disamping kanan atas halaman.
Untuk para pembaca yang ingin memnyampaikan pesan melalui buku tamu dimohon pengertian dan maafnya,hal ini saya lakukan karena saya menggunakan koneksi lambat untuk akses internet disamping untuk optimalisasi SEO blog ini.

Untuk anda yang ingin dan mau memasang kotak chat melayang seperti saya,berikut adalah langkah-langkahnya :

1.Tambahkan kode script di bawah ini kedalam  kotak chat milik anda..!



<style type="text/css">
#gb{
position:fixed;
top:100px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:250px;
width:50px;
float:left;
cursor:pointer;
background:url('http://i754.photobucket.com/albums/xx181/ciptocamsa/coollogo_com-115637084.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #81F781;
background:#81F781;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe frameborder="0" width="250" height="305" src="http://www7.cbox.ws/box/?boxid=364306&amp;boxtag=bb9z9t&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#025400 1px solid;" id="cboxmain"></iframe></div>
<div><iframe frameborder="0" width="250" height="75" src="http://www7.cbox.ws/box/?boxid=364306&amp;boxtag=bb9z9t&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#025400 1px solid;border-top:0px" id="cboxform"></iframe></div>
</div>
<!-- END CBOX -->
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>



2.Script yang berwarna biru ganti dengan script Cbox milik anda..!
3.Save

Sekarang berat blog anda berkurang dan loadingnya semakin ringan.
Semoga bermanfaat....dan jangan lupa berikan komentarnya jika ingin mendapat backlink dari blog dofollow ini...!
Bagikan artikel via :

9 komentar:

  1. info yang mantabs gan, saya simpan dulu ntar klo udah perlu aja, met idul fitri maaf lahir batin

    BalasHapus
  2. Mantap tu sob, bs mempersimpel tampilan blog,,
    Makasih ilmunya, salam blogger!

    BalasHapus
  3. Menarik nih infonya. Saya juga lagi pengen pasang floating chatbox, tapi mungkin ga dalam waktu dekat

    BalasHapus
  4. Wahh siip Tutornya
    Lanjutkan posting ttg Tutor Blog
    Sukses selalu

    BalasHapus
  5. terima ksih dan knjngi jg http://playgamesurfi.blogspot.com/

    BalasHapus
  6. waduh terimakasih sekali banyak manfaat yg bisa tak ambil....

    BalasHapus
  7. terima kasih infonya mas,wah saya juga lagi cari widgat yang ini.

    BalasHapus
  8. Thank u boss.. Mantap.. cuma mohon infonya donk warna yang maching dengan template saya... jng lupa mampir ya.. http://jepred.blogspot.com
    Thanks

    BalasHapus

 
Support : Your Link | Your Link | Your Link
Copyright © 2013. PRAPATAN KERTEK - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger