0 cara membuat buku tamu melayang disamping blog

mari kita bahas mengenai buku tamu yang akan kita buat kali ini yaitu membuat buku tamu melayang yang tepatnya kita akan membuatnya melayang di samping kanan blog, dengan saat ini tombol gambar yang bertulisan buku tamu ini warnanya akan berubah sesuai dengan waktu yang telah di atur di dalam scriptnya sebelumnya atau animasi pada gambar tombol gambar tersebut karena kita di sini menggunakan gamat gif/animasi yang bertuliskan buku tamu, fungsi kita menerapkan buku tamu secara melayang ini yaitu supaya para pengunjung bisa lebih mudah untuk memberikan saran atau sekedar sapaan dan hal lainnya yang tentunya positif, baiklah mari kita langsung saja menuju langkah-langkahnya ;

1. Daftar terlebih dahulu ke www.cbox.ws untuk membuat kode buku tamu
2. Login ke Blogger.com 

3. Klik Rancangan

4. Di Elemen Laman klik Tambah Gadget

5. Lalu tambahkan HTML/JavaScript dengan cara klik tanda +

6. Masukan script di bawah ini

<!-- buku tamu disamping end --!>
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i37.tinypic.com/345o85i.gif') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</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">

Letakan Script/code Shoutbox(cbox/buku tamu) di sini

<br/>
<div style="text-align:right"><a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
</div>

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

6. Simpan dan lihat hasilnya.

Keterangan :

• Letakan Script/code Shoutbox(cbox/buku tamu) di sini
gantilah script warna merah ini dengan script shoutbox/cbox/lainnya yang tepatnya akan berfungsi sebagai buku tamu.
• http://i37.tinypic.com/345o85i.gif nah script ini bsa Anda ganti dengan tombol gambar yang bertuliskan Buku Tamu yang sesuai untuk di gunakan di situs Anda
• top:50px; nah kalau script ini untuk mengatur tinggi rendahnya posisi buku tamu nantinya, jika ingin posisinya lebih atas maka tinggal kurangi nilainya seperti 10px dan atau ingin posisinya lebih bawah tinggal menambah nilainya seperti 125px misal.