Cara membuat "Buku Tamu" tersembunyi

1. Click "Tata Letak" atau "Design"
2. Buat gadget baru dengan click "Tambah Gadget" atau "Add a Gadget" pilih yang "HTML/Javascript"
3. Tidak perlu mengisikan kolom "Judul" atau "Tittle", biarkan dalam kondisi kosong
4. Copy dan Paste kode berikut Di Kolom HTML/JavaScript :

1:  <style type="text/css">  
2:  #gb{  
3:  position:fixed;  
4:  top:50px;  
5:  z-index:+1000;  
6:  }  
7:  * html #gb{position:relative;}  
8:  .gbtab{  
9:  height:100px;  
10:  width:30px;  
11:  float:left;  
12:  cursor:pointer;  
13:  background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio5g5xDAhB0fwJbAFtIZ4n9VLB64x0hwa-QHmPTJe7QsVMnve4R4fpFkCmWOq5UaTxappvp4cf2JANrKYyJOjLM6zngB4I3ko5p834F3DFEOhyphenhyphenLHyyg9g5pORmJAxVto5OftVNmPolyJAp/') no-repeat;  
14:    
15:  }  
16:  .gbcontent{  
17:  float:left;  
18:  border:2px solid #A5BD51;  
19:  background:#F5F5F5;  
20:  padding:10px;  
21:  }  
22:  </style>  
23:  <script type="text/javascript">  
24:  function showHideGB(){  
25:  var gb = document.getElementById("gb");  
26:  var w = gb.offsetWidth;  
27:  gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);  
28:  gb.opened = !gb.opened;  
29:  }  
30:  function moveGB(x0, xf){  
31:  var gb = document.getElementById("gb");  
32:  var dx = Math.abs(x0-xf) > 10 ? 5 : 1;  
33:  var dir = xf>x0 ? 1 : -1;  
34:  var x = x0 + dx * dir;  
35:  gb.style.right = x.toString() + "px";  
36:  if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}  
37:  }  
38:  </script>  
39:  <div id="gb">  
40:  <div class="gbtab" onclick="showHideGB()"> </div>  
41:  <div class="gbcontent">  
42:  <!-- Letakkan kode buku tamu anda di bawah ini -->  
43:  <div style="text-align:right">  
44:  <a href="javascript:showHideGB()">  
45:  [close]  
46:  </a>  
47:  </div>  
48:  </div>  
49:  </div>  
50:  <small>Widget by: <a href="http://rezdown7.blogspot.com/" target="_blank">Rezdown7</a></small>  
51:  <script type="text/javascript">  
52:  var gb = document.getElementById("gb");  
53:  gb.style.right = (30-gb.offsetWidth).toString() + "px";  
54:  </script>  

Catatan :

• Pada Line 13, ubah "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio5g5xDAhB0fwJbAFtIZ4n9VLB64x0hwa-QHmPTJe7QsVMnve4R4fpFkCmWOq5UaTxappvp4cf2JANrKYyJOjLM6zngB4I3ko5p834F3DFEOhyphenhyphenLHyyg9g5pORmJAxVto5OftVNmPolyJAp/" adalah gambar tombol, bila ingin merubahnya dengan tombol bentuk sendiri, silahkan diubah dengan URL gambar yang Anda miliki, bila tidak juga tidak masalah.
• Kode warna pada Line 18 & Line 19 adalah warna garis pinggir & warna latar belakang, bilamana warna nya mau dirubah, silahkan diubah #A5BD51 & #F5F5F5 menjadi warna pilihan Anda sendiri. Panduan mengenai pilihan warna-warna HTML bisa dilihat disini.
• Pada Line 42 terdapat tulisan "<!-- Letakkan kode buku tamu anda di bawah ini -->", silahkan sisipkan kode Shoutmix / Buku Tamu atau kode yang lain yang ingin Anda tampilkan pada buku tamu Anda.

5. Setelah selesai, tekan SAVE lalu lihat hasilnya ^^.

informasi yang bermanfaat ini saya dapatkan dari :

http://rezdown7.blogspot.com/2011/01/shoutboxbuku-tamu-showhide-di-samping.html