Cara Buat Buku Tamu di Blog

sumber: cksit2.w.interia.pl

TNC. Buku tamu disuatu blog, cukup berguna untuk saling berinteraksi dengan pengunjung blog (contohnya dibagian kanan blog ini). Pengunjung bisa menyapa, dan meninggalkan pesan di buku tamu. Belum punya buku tamu.? pengen pasang buku tamu.? langsung saja, ini dia caranya.

Untuk buku tamu di blog ini, saya sembunyikan di bagian kanan. Ini untuk menghemat tempat, dan juga sedikit terlihat keren (menurut saya sendiri). Selain membuat buku tamu, saya juga akan share bagaimana caranya membuat buku tamu tersebut tersembunyi.

Cara Membuat Buku Tamu

Siapkan terlebih dahulu script (kode) buku tamu. bisa shoutmix, bisa Cbox, kemudian simpan script (kode) di notepad atau MS Word.

1. Siapkan dulu sob, script buku tamu kalian. Bisa Shoutmix, bisa Cbox. Lalu simpan di notepad. (saya pake shoutmix). jika shobat belum punya scriptnya, login terlebih dahulu di Shoutmix

2. Login ke blogger, lalu klik Rancangan, Add Widget, HTML/Javascript ( Tips : Tempatkan widget di samping kiri dan jangan diberi judul)

3. Copy paste script berikut :

<style type="text/css">

#gb{

position:fixed;

top:23px;

z-index:+1000;

}

* html #gb{position:relative;}

.gbtab{

height:100px;

width:30px;

float:left;

cursor:pointer;

background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') 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">

( Tempatkan Script Buku Tamu kalian disini)

<br/>

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

<a href="javascript:showHideGB()">

[Close]

</a>

</div>

</div>

</div>

<script type="text/javascript">

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

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

</script>

Warna Merah : Ganti dengan script buku tamu kalian yang telah disimpan di notepad

Warna Biru : Bisa diganti dengan url gambar tombol buku tamu. Kalau malas, dibiarkan saja juga tidak apa-apa.

4. Tinggal save, jadi  deh...

Gampang kan? Dengan ini kalian bisa menghemat ruang untuk penempatan buku tamu yang biasanya memakan banyak ruang blog kalian. Sekian Tutorial Ngeblog yang saya bisa berikan, kalau ada masalah atau terjadi error, silahkan kontak saya dengan memberikan komentar di bawah. Terimakasih