Cara membuat Chat Box disamping kanan blog

بِسْمِ اللهِ الرَّحْمنِ الرَّحِيمِ

memasang Chat Box juga salah satu cara untuk menghias blog kita biar tambah keren, cara nya sih mudah tapi kalau ada kesusahan tinggal chat atau koment, oke my friends langsung aja yha !!

Cara mendapatkan kode Chat Boxnya :

• buka link ini http://www.cbox.ws setelah itu akan ada gambar kayak gini

• setelah itu login, jika belum punya daftar dengan klik sing up, nanti akan ada gambar seperti berikut (buat yang sudah daftar dan login)

• setelah itu klik Publish!, setelah itu kita akan ditujukan ke halaman berikutnya seprti gambar berikut

• sebut saja code nya KodeCBOX

Cara memasangnya :

• Copy kode berikut

<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/AVvXsEiFYBvWuK4YOpMRTGeCUDNV1rC46-bGM6GgnJhyphenhyphenMlCAqfVfZg64edhoey3RWo5e6AjG7wr6jK9nv6RviiWrQIJtGUubEq1bgHDarWJe5fSFTliIDFfStePTo1wGMfoOrggNpNK409I9VdA-/s1600/bukutamu.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #74A64E;
background:#F5F5F5;
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">
<div style="background-position:center;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaj4E1V0orTpePGYG9Epa3N1WIhuVnoITLdgJkv9rvenQ13iWhSESYemlIiZ79DgIqZ47O9pi86I3sXJaRBV9UrNVLwiuFsNjb2OTP8SB7lHf9SGLjJ5AXuSaglPsOdVN31Va4OHuQWous/s1600/avawae+2.PNG); width:200px; height:350px; padding-top:60px;padding-left:1px; background-repeat:no-repeat;"> <!--
Isikan dengan KodeCBOX agan, </div>
<div style="text-align:right">
<a></a>><a href="javascript:showHideGB()">
[Tutup]
</a>
</div>

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

• buka blog agan
• masuk Tata Letak > Tambahkan Gadget > HTML/JavaScript > pastekan kode nya dan SAVE

PERHATIAN :

1. kode yang warna Hijau :  gambar buku tamunya (bisa diganti dengan selera agan)
2. kode yang warna Kuning : gambar background buku tamunya (bisa diganti dengan selera agan)
3. kode yang warna Merah : gantikan dengan KodeCBOX agan

Gampang kan ?? tapi masalahnya tangan admin yang pegel hhe :D gpp kok demi agan tercinta :D, Terima kasih sudah berkunjung :), jika masih ada yang kurang ngerti bisa koment atau Chating lewat CBOX punya admin :)