Cara Membuat/Memasang Chatbox di sebelah kiri blog

Ok, langsung saja kita mulai bagaimana cara Membuat/Memasang Chatbox di sebelah kiri blog. Ikuti langkah demi langkah dibawah ini:

1. Masuk ke blogger.com
2. Pilih tata letak
3. Tambah gadget
4. Pilih HTML/JavaScript
5. Masukan kode di bawah ini:

<style>

#hcl {

position:fixed;

top:40px;

left:0px;

z-index:+1000;

}

* html #hcl {position:relative;}

.hcltab {

height:100px;

width:30px;

float:left;

cursor:pointer;

background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp5Q6Tp_MKrctGrVbyMF-IbB6vrAy4dhi9m5fzOJy0N2tvcYKBDbMRsSXnzSeoLOMpg3iFgt8mgVd_YtwqkzG0wxbRmbWH0ZBk9GRfrg89HlkJpnF1wfayFsTzg9JmF3HkQyzop4WkYjM/s400/cbred-LEFT.png') no-repeat;

}

.hclcontent {

float:left;

border:2px solid #790909;

background:#f3f6f7;

padding:10px;

}

.hc-credit {font-size:9px}

.hc-credit a {text-decoration:none}

</style>

<script type="text/javascript">

function showHidehcl(){

var hcl = document.getElementById("hcl");

var w = hcl.offsetWidth;

hcl.opened ? movehcl(0, 30-w) : movehcl(20-w, 0);

hcl.opened = !hcl.opened;

}

function movehcl(x0, xf){

var hcl = document.getElementById("hcl");

var dx = Math.abs(x0-xf) > 10 ? 5 : 1;

var dir = xf>x0 ? 1 : -1;

var x = x0 + dx * dir;

hcl.style.left = x.toString() + "px";

if(x0!=xf){setTimeout("movehcl("+x+", "+xf+")", 10);}

}

</script>

<div id="hcl">

<div class="hclcontent">

Disini Kode ChatBox kamu

<br />

<div class="hc-credit">

<span style="float:left">

<!-- THIS CREDIT MUST STAY INTACT FOR LEGAL USE -->

Catatan:

•  Kode yang saya cetak tebal dan saya beri warna Merah Ganti dengan kode Chatbox anda.
• Kode saya cetak tebal dan saya beri warna biru Bisa anda ganti dengan gambar chatbox lain sesuai selera anda sendiri.

Semoga Cara Membuat/Memasang Chatbox di sebelah kiri blog dapat bermanfaat...