cara membuat buku tamu melayang di kiri blog [Edisi2]]

        Oke ini adalah lanjutan dari Post saya yang sebelumnya. kali ini saya akan berbagi caranya membuat buku tamu yang melayang di kiri blog anda.

Untuk Memasang buku tamu di sisi sebelah kiri blog anda :
Tambahkan kode HTML / Script di bawah ini di widget blog Anda

<!-- left hidden chatbox by http://www.sobatfauza.co.vu/ START -->
<style>
#hcl {
position:fixed;top:100px;
left:0px;
z-index:+1000;
}
* html #hcl {position:relative;}
.hcltab {height:100px;width:30px;
float:left;
cursor:pointer;
background:url('http://i1227.photobucket.com/albums/ee440/danghilal/idesainer/shoutbox-1.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">
Silakan Pasang Kode Buku Tamu sobat yang sudah di copy tadi Di Sini
<br />
<div class="hc-credit">
<span style="float:left">
<!-- THIS CREDIT MUST STAY INTACT FOR LEGAL USE -->
<span >
<span > Get this</span>
<a href="http://www.sobatfauza.co.vu/2013/03/cara-membuat-buku-tamu-yang-melayang-di.html" target="_blank">
<span class="Apple-style-span" > Desaign1</span> </a>
</span>
</span>
<span style="float:right">
<a href="javascript:showHidehcl()">
[close]
</a>
</span>
</div>
</div>
<div class="hcltab" onclick="showHidehcl()"> </div>
</div>
<script type="text/javascript">
var hcl = document.getElementById("hcl");
hcl.style.left = (30-hcl.offsetWidth).toString() + "px";
</script>
<!-- left hidden chatbox by http://www.sobatfauza.co.vu/ END -->

Note : Ganti Kode yang berwarna hijau dengan kode buku tamu / shoutbox Anda




How to Instalasi :

 Step yang Pertama :
Anda Login terlebih dahulu ke akun Blogger Anda

Kedua :
Pergi ke Rancangan / Design pada Dashboard Anda

Selanjutnya :
Untuk Meletakkan Buku Tamu Disisi Kanan Blog :
Tambahkan kode HTML / Script di bawah ked widget blog anda (Anda sudah pasti tahu)

Dan Step yang Terakhir :
Simpan Template dan Lihat Hasilnya.