Cara Membuat Buku Tamu pada Blogger

Buku tamu atau tempat Chat alias komunikasi pada blog merupakan suatu kebutuhan yang lumayan penting bagi sebuah blog. Karena dengan adanya Buku Tamu, seorang admin dengan penikat blognya akan dapat berkomunikasi. Mungkin dapat memberi saran ataupun sedang Blogwalking. Ini juga perlu untuk mempererat tali silaturrahmi antar pengguna blogger.

Artikel tentang Buku Tamu ini saya buat atas request dari teman saya yang ingin membuat buku tamu namun masih kesulitan dalam pembuatannya. Semoga dengan adanya artikel ini teman saya dapat membuat buku tamu sesuai dengan keinginan hatinya. Hehe!

Berikut cara untuk membuat buku tamunya :

1. Masuk ke admin blogger anda

2. Masuk ke Rancangan

3. Silahkan anda buka Widget baru > pilih HTML/ JavaScript

4. Masukkanlah kode Script dibawah ini

5. Simpan

<style type="text/css">

#gb{

position:fixed;

top:20px;

z-index:+1000;

}* html #gb{position:relative;}

.gbtab{

height:150px;

width:50px;

float:left;

background:url('http://i1042.photobucket.com/albums/b429/Farix_2010/Chatting.png') no-repeat;

}

.gbcontent {

float:left;

border:1px solid #BB0000;

-moz-border-radius-bottomleft:10px;

-webkit-border-radius-bottomleft:10px;

-o-border-radius-bottomleft:10px;

-khtml-border-radius-bottomleft:10px;

-moz-border-radius-topright: 10px;

-moz-border-radius-topleft: 10px;

background: #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjP0y1sAIkhqFjtS2IHXDLQJUf2NKjqeTEydIvXDm6EEkh95Uyvhit1Tpyd2gM2LvS0O5qdokogzEMaWxU1d6QB227FTRZrfUhV5HUORNYEWxau93As4kLsdPoFC85gkeJBxMCZsxnlbjlq/s1600/api.gif) no-repeat bottom;

padding:10px;

}

</style>

<script type="text/javascript">

function showHideGB(){

var gb = document.getElementById("gb");

var w = gb.offsetWidth;

gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);

gb.opened = !gb.opened;

}function moveGB(x0, xf){

var gb = document.getElementById("gb");

var dx = Math.abs(x0-xf) > 25 ? 25 : 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+")", 5);}

}</script>

<div id="gb">

<div class="gbtab" onmouseover="showHideGB()"> </div>

<div class="gbcontent">

<center>

kunjungi blog www.life-itech.blogspot.com

<br />

<div style="text-align:center">

<a onclick="showHideGB()" class="tips-fade" title="klik untuk tutup chattingbox">

<center><hr /><img src="http://i1042.photobucket.com/albums/b429/Farix_2010/CloseComment-1.png" /><hr /></center>

</a>

</div>

</center></div>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.right = (50-gb.offsetWidth).toString() + "px";

</script></div>

*Keterangan :

Pada tulisan yangh berwarna merah, ganti dengan kode Shoutmix atau CBox anda.