Wah,, Baru saja saya share Software,kali ini saya akan share sebuah tips untuk blog..hehehe.
biyar nggak jenuh gtu looo... ada software ada Tips-tips.
Kali ini saya mau kasih tips bagaimana cara memasang Buku tamu atau istilah asing nya nih chat Box...hehehhe
Walau tips lama hari ini saya mau share lagi ah..mungkin sobat uda lupa dengan cara ini..
Guna chat Box ini sebenar nya simple.. pengunjung bisa chat langsung melalau chat box yang sudah di sediakan.. dan mempercantik blog juga tentu nya... pasti mau kan .. yuk simakk bagaimana cara-cara nya.






1. Sobat harus membuat akun dulu dari situs free penyedia Chatbox ata Buku Tamu disini www.cbox.ws. Tapi kalau sobat sudah punya, ya tidak perlu daftar lagi.

2. Lalu Sign Up dan pilih Create My Cbox dan ikuti langkah membuat akunnya sampai selesai. Mudah kok sob, Saya yakin sobat Cyber bisa.

3. Setelah selesai membuat akunnya, klik Public dan Copy code Cbox yang telah disediakan.

4. Oke sob, sekarang kita beralih ke blog sobat. Setalal sobat Login ke blog Sobat, langsung aj ke tab layout dan klik Add Gadget/Tambah Gadget sobat, dan pilih HTML/Javascript.

5. Kemudian masukkan kode dibawah ini

<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/AVvXsEg7d8ZKPLWOxhIW0wanBrlpZvYhXUxq4yNR7j0R6LaCWGBs14qPkfGLLXDhYkKyt4ip52PMLWNBRbH3yk0HayucDnp3AXKhEKwXJq99ekv-l2Vr_MO9gCql2Na7tXIF4XSIH9L6fyI8G_A/s1600/bukutamu.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
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">

Sobat Juga bisa mengganti Icon Chatbox atau Buku Tamu sobat Cyber dengan Image dibawah, dengan cara mengganti code yang background diatas yang berwarna biru ini https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7d8ZKPLWOxhIW0wanBrlpZvYhXUxq4yNR7j0R6LaCWGBs14qPkfGLLXDhYkKyt4ip52PMLWNBRbH3yk0HayucDnp3AXKhEKwXJq99ekv-l2Vr_MO9gCql2Na7tXIF4XSIH9L6fyI8G_A/s1600/bukutamu.png dengan code dibawah ini.

Url Gambar : https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAam1e8FJWQgcBvpehbDHwt6JtmslqV2JAD8w5DuGVMLp9RMssHnfvq9mUQrna8efqZNyJG7S-Nh8bvD3FG94B1DQEcHUoQYhFyvvStW5byDAAq6_2SlzmvQXKNefvc6DNCpvDARaibFke/s1600/cbblue-2.png
Warna border #0079a0

Url Gambar :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgORh9VXKHm4MRqfFCJyjt9Cjzq_Ech7eAwb3hraN-jFRu0bbHMDJKejkpkjnWcIgQH4YZgj-0XbOpDMJcgflz-NZcz8NR4Yqp-fza_vdE_0h3u4JmGvO9vP62UHcx9If6IqK4hFYMT8xJV/s1600/cbblue.png
Warna border #003e82

Url Gambar :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNsMlyogygpF77FT2Rv_RlO-8snrmGNVGYGialPCXPDgZZy9ubiAbLNDWy8W-vdyOw1h-FktCDLajj2ZSIJA_ciPgC5Azo6c87jR2JTiQiLnB5cdTbndOe0coGot-GKdXhFSokcSrgmdCw/s1600/cbgreen.png
Warna border #008232

Url Gambar :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQIc0k1cs8r7onW3T4_q-sgMJtt0Odxbb7rBRej0NjRPtWtJp7paa3yhfPtgxialhQ2ORGgvd_v4NCfrKL516m5OvoyD1lQ9CjyYY_kg89I6UMlpeheQx9vWaQSoLBiZo0rMVVSi9llyNE/s1600/cbyellow.png
Warna border #aca500

Url Gambar :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0yOlcsyJd2m3gARszEBHi7sCCjDDirZR8AjIKvKGR-G6K41ClaOV_2IVNDLWdxFgEpbr0kC_2TYBxTdMIkQHzgfBrx7C0KrL25PyDaTI0-lryMfg29Q-RKOHER9XEiZxBUpFGHnHtUI62/s1600/cbred.png
Warna border #790909

Selamat Mencoba & Semoga Sukses ^_^

Do you like this article? Share It!