Membuat Buku Tamu Auto Hide

Hay sobat blogger !!
Udah pada punya Buku Tamu untuk blog kalian belum ? Bagi yang sudah punya,kini udah ada cara agar Buku Tamu kalian bisa otomatis muncul dan masuk lagi seperti yang sudah saya pasang itu.Dengan menggunakan Auto Hide ini,bisa membuat blog kalian agar minimalis pada tampilannya.Selain itu juga bisa membuat tampilan blog anda menarik.Bisanya Buku Tamu ini digunakan oleh jenis blog DoFollow.
Khususnya buat kalian yang blognya DoFollow,silahkan menggunakan Buku Tamu ini.Ada beberapa jenis Buku Tamu seperti Cbox , shoutmix dan lain sebagainya.
Untuk membuat auto hide Buku Tamu anda,silahkan ikuti langkah langkah berikut :

• Memdaftar pada layanan Buku Tamu atau jika anda memiliki kode script sendiri untuk buku tamu anda
• Login ke Blog anda dan masuk pada Tata Letak
• Kemudian,tekan opsi tambah Wigdet
• Pilih widget HTML/JavaScript
• Masukkan kode berikut

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:117px;
width:50px;
float:left;
cursor:pointer;
background:url('http://sites.google.com/site/pahingdesign/images/tabs-paper-cuss-Clip.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #E0E0E0;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 47-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">
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe frameborder="0" width="250" height="335" src="http://www6.cbox.ws/box/?boxid=592550&amp;boxtag=bcg22c&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain6-592550" style="border:#FFFFFF 1px solid;" id="cboxmain6-592550"></iframe></div>
<div><iframe frameborder="0" width="200" height="75" src="http://www6.cbox.ws/box/?boxid=592550&amp;boxtag=bcg22c&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform6-592550" style="border:#FFFFFF 1px solid;border-top:0px" id="cboxform6-592550"></iframe></div>
</div>
<!-- END CBOX -->

<br />
<div style="text-align:center">
<span style="float:right; color:#000000;">Menjadi Member <a target="_blank" href="http://www.blogger.com/follow-blog.g?blogID=6717122771882590957"> SEKARANG!!! </a></span>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>

</div>

Gantilah kode yang warna merah dengan URL icon dari Buku Tamu anda
Gantilah kode yang warna oranye dengan kode script milik anda
Kode warna kuning adalah
 top        :Posisi jarak Buku Tamu anda dari atas.Bisa diganti dengan bottom untuk jarak dari bawah
height     : tiggi dari icon anda
width     : lebar dari icon anda
float       : posisi untuk icon anda.
Kode warna biru,bisa disesuaikan dengan blog anda
Kode warna ungu,bisa diganti dengan right,top,bottom

• Jika sudah anda masukkan kode seperti diatas,silahkan di Save dan lihat hasilnya

Sekian artikel dari saya,semoga bermanfaat untuk blog anda.Meskipun kodenya cukup rumit,semoga tidak membuat anda kebingungan
Terima Kasih

Semoga Bermanfaat dan Berhasil