Cara Buat Buku Tamu Ringan

Halo sahabat belogger , kali ini saya ingin berbagi tentang cara membuat buku tamu tersembunyai atau auto hidden. Kita semua tau dengan adanya buku tamu ini para mengunjung dapat meninggalkan pesannya atau bisa langsung chat dengan admin dalam bentuk cbox. Oke berikut ini langkah-langkah membuat buku tamu auto hidden :

• Pertama login dulu dong blog sobat
• Kemudian langsung aja menuju Tata Letak noh
• Pilih Tambahkan Gedget - HTML/javascript
• Eh sebelumnya sobat daftar dulu terus tentuin buku tamu yang sobat mau langsung klik kesini aja ya http://www.cbox.ws/http://www.cbox.ws/
• Nah Tahan dulu klo udah dapet kodenya
• Kita kelangkah ini aja dulu yaitu copy kode-kode HTML berikut ini sobat dan masukan ke dalam gedget HTML/Javascript yang sobat tambah tadi

<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}
.gbtab{
height:150px;
width:50px;
float:left;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3ZgaV4MnqSuMUQK6lclbdtn9gCi5YkY-mY6aghSDDQZOkhzicVHsG53dQiv4_IGuX3zbn6nrF6GhJX1EPqwSgwr4qN6TeqrB7oxc89OE-6RnnoadDYdzN592gegbg6bFCK7b4UUM4Wt0/s1600/buku+tamu.png') no-repeat;
}
.gbcontent {
float:left;
border:1px solid #000000;
-moz-border-radius-bottomleft:5px;
-webkit-border-radius-bottomleft:5px;
-o-border-radius-bottomleft:5px;
-khtml-border-radius-bottomleft:5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-topleft: 5px;
background: #F2F2F2; url() no-repeat bottom;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 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+")", 5);}
}</script>
<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>
<div class="gbcontent">
<center>
Letakkan kode script buku tamu disini
<br />
<div style="text-align:center">
<span style="float:right; color:#000000;">Get this <a target="_blank"href="http://idegemilang.blogspot.com/2013/06/cara-mudah-membuat-buku-tamu.html"> widget </a></span>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>
</div> 

• Nah bacaan yang berwarna merah adalah kode dari http://www.cbox.ws/http://www.cbox.ws/

• Nah baru sudah hampir selesai ni tinggal klik save
• Dah selesai....:)

Gimana gampangkan sobat!!!!!!!!