Tutorial Widget Buku Tamu

*--Assalamu'alaikum Wr. Wb. Salam CREATIVE sobat dan agan semuanya yang saya hargai. Jumpa lagi dengan saya dimana pada kesempatan kali ini saya ingin berbagi sebuah tutorial untuk agan semua yang mungkin kebanyakan darinya punya web / blog. Artikel saya kali ini mungkin cukup menarik, sesuai dengan judulnya. Langsung saja berikut ulasan artikel saya kali ini selamat membaca.

*--widget buku tamu. Kalian pasti pengen chat online langsung. Kalau begitu tunggu apa lagi silahkan diikuti tjtornya. Pertama-tama silahkan buat akun kamu dulu di cbox.ws atau di situs penyedia script buku tamu gratis yang kamu suka. Lengkapi pendaptaran kamu, kemudian copy kode yang sudah di sediakan dari web tersebut, selanjutkan masukkan kode buku tamu kamu ke blog.Oke saya rasa tidak perlu panjang lebar, ayo di mulai... Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :
1. Klik Tata Letak .
2. Klik Tambah Gadget .
3. Pilih Gadget HTML/Javascript .
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

<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://1.bp.blogspot.com/-mTaSn5IhibQ/UY4zfatukzI/AAAAAAAAA8k/Fh-y4AcfOUk/s1600/Bukutamu6.gif') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style><br />
<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><br />
<div id="gb">
<div class="gbtab" onclick="showHideGB()">
</div>
<div class="gbcontent">
<br />
Masukkan Kode Buku Tamu Kamu Di Sini<br />
<br />
Terimakasih Atas Kunjungan<br />
My-Premier_Blog<br />
<br />
<div style="text-align:right">
<a href="http://own-mycreation.blogspot.com/">[Mau Widget Ini?]</a>><a href="javascript:showHideGB()"><br />
[Tutup.]<br />
</a><br />
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script><br />   <br>

Didalam kode tersebut terdapat kata masukkan kode buku disini. Nah disitulah agan letakkan kode chat boxnya yang agan dapatkan di langkah atas tadi. Jika sudah klik save dan lihat hasilnya. Selamat mencoba. Demikian tutorial yany simple dari saya apabila ada kendala yang terjadi silahkan berkomentar. Dan bila suka di share ya gan. Sekian artikel saya kali ini, semoga kita berjumpa lagi di artikel saya selanjutnya & semoga artikel saya kali ini bermanfaat untuk sobat semuanya.

Assalamu'alaikum Wr. Wb.