Cara menyembunyikan chatbox pada blog

Setelah pada postingan sebelumnya saya menshare tentang membuat chatbox, kali ini saya akan memposting tentang cara menyembunyikan chatbox tersebut.






1. Login ke blogger terlebih dahulu.
2. Setelah itu Buka Rancangan - Elemen Laman.
3. Tambah Widget - Html/javascript
4. Copy paste Code berikut di sana

<style type="text/css">

#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPoRpATO10lIxnZ3gy7zWZ45SHcRl3UuL1BnmmOu2oZ1qwvpWpz5xRoMRhdKkG1fuWtnK6LJDuWwuCMtrlJbaIrJZR6lUIdJMzg0tYHy56_zNoycSkjlOvA6D979jbz6R9j1t5HrG6z6I/s1600/cbred-LEFT+copyasasd.png') no-repeat;
}
.gbcontent{
float:left;
border:6px solid #de7300;
background:#F5F5F5;
padding:5px;
}
</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">

Ganti Dengan Code Script Chat Box  Kamu

Get This <a href="http://dikdik-nurhadi.blogspot.com/2012/04/cara-menyembunyikan-chatbox-pada-blog.html">Gadget</a></div>
<div style="text-align: right;">
    <a href="javascript:showHideGB()">
    Close
    </a></div>

    </div>

    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.right = (30-gb.offsetWidth).toString() + "px";
    </script>

NB : ganti tulisan yang berwarna MERAH dengan kode script chatbox kamu.

Tweet