Pasang Buku Tamu Tersembunyi

Assalamualaikum agan agan dan sista nya
ketemu lagi nih . pada posting kali ini ane akan share tentang buat buku tamu yang tersembunyi haha
Untuk memudahkan pengunjung meninggalkan pesan singkat di blog, agan dapat menggunakan buku tamu. Banyak situs yang menyeiakan layanan pembuatan buku tamu, seperti di  shoutcamp, dan Cbox. Buku tamu merupakan salah satu sarana untuk berinteraksi antara pemilik blog dengan para pengunjung blog dalam rangka mempererat tali silahturrahim. Bila blog agan belum di pasang buku tamu, silanhkan baca buat di sini
Masalah yang mungkin muncul adalah bahwa agan kesulitan memasang buku tamu di sidebar (biasanya buku tamu di pasang di sidebar) blog. Ini tergantung template yang agan gunakan. untuk mengatasinya atau menghemat tempat, agan dapat memasang buku tamu tersembunyi. Walaupun namanya buku tamu tersembunyi, bukan berarti form buku tamu tersebut tidak dapat dilihat, akan tetapi tetap terlihat namun hanya sebagian saja, yaitu berupa tombol yang terdapat di sisi halaman blog. Dengan cara mengklik tombol, kotak dialog buku tamu akan terbuka. Begitu juga untuk menutupnya dengan cara mengklik tombol tersebut. Jadi sistemnya mirip dengan tombol hide-show.

Untuk memasang buku tamu tersembunyi di blog, ikuti langkah-langkah berikut!

• Silahkan Login di Blogger 
• Masukkan ID dan Password agan.
• Pada Dasbor klik Rancangan
• Pada Elemen Laman klik Tambah Gadget
• Pada Tambahkan Gadget Pilih HTML/JavaScript
• Isi Judul yang agan suka atau di kosongkan saja
• Pada Konten isi dengan kode HTML di bawah ini:

<style type="text/css">
#gb{
position:fixed;
top:100px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://lh5.googleusercontent.com/_A9Nk3CE9KcY/Tb-05vCbwUI/AAAAAAAAAUc/F2qssrYMjcs/s128/BT.gif') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:2px;
}
</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">

(---Masukkan di sini script kode buku tamu agan---)

</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

• Klik tombol Simpan
• Tarik Gadget tersebut di tempat yang agan inginkan
• Klik tombol Simpan lagi untuk memastikan agan telah menambahkan Gadget baru di blog
• Selesai, lihat hasilnya.