Cara Membuat Buku Tamu Melayang Di Sisi Kanan Blog

Hai para sobat blogger. Kali ini saya akan menjelaskan bagaimana tentang  Cara Membuat Buku Tamu Melayang Di Sisi Kanan Blog. Menurut saya chatbox/buku tamu sangatlah penting bagi pengunjung blog kita.Tahu nggak kenapa? karena buku tamu adalah tempat berinteraksi antara pengunjung dan pemilik blog itu sendiri. Makanya saya menganjurkan sobat blogger untuk memasang chatbox/shoutbox.Caranya cukup mudah kok, coba lihat di bawah.



Langkah-lankah membuatnya :

1. Login ke Blogger 
2. Klik "Rancangan"
3. Klik "Tambah Gadget"
4. Klik tandan plus HTML/javascript
5. Setelah itu masukkan kode di bawah ini:

<style>
#hcr {
position:fixed;
top:80px;
z-index:+1000;
}
* html #hcr {position:relative;}
.hcrtab {
height:150px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i1074.photobucket.com/albums/w418/imboh46/Bukutamu.png') no-repeat;
}
.hcrcontent {
float:left;
border:2px solid #003e82;
background:#f3f6f7;
padding:10px;
}
.hc-credit {font-size:9px}
.hc-credit a {text-decoration:none}
</style>
<script type="text/javascript">
function showHidehcr(){
var hcr = document.getElementById("hcr");
var w = hcr.offsetWidth;
hcr.opened ? movehcr(0, 30-w) : movehcr(20-w, 0);
hcr.opened = !hcr.opened;
}
function movehcr(x0, xf){
var hcr = document.getElementById("hcr");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
hcr.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("movehcr("+x+", "+xf+")", 10);}
}
</script>
<div id="hcr">
<div class="hcrtab" onclick="showHidehcr()"> </div>
<div class="hcrcontent">

Masukan Kode Shoutbox / Buku tamu sobat di sini

<!-- END CBOX -->
<div class="hc-credit">
<span style="float:left">

</span>
</div>
</div>
</div>
<script type="text/javascript">
var hcr = document.getElementById("hcr");
hcr.style.right = (30-hcr.offsetWidth).toString() + "px";
</script>
<!-- right hidden chatbox END -->

Selamat Mencoba.

Posted in: tips blogger