cara membuat buku tamu di blog

Cara Buku Tamu

Membuat atau memasang buku tamu atau guestbook yang melayang di sisi kanan blogdi blog merupakan hal yang sangat menyenangkan untuk dilakukan karena selain dapat memperindah atau mempercantik tampilan blog dengan membuat butu tamu memberikan fitur yang menyenangkan dan sangat berguna untuk mempererat hubungan para blogger dengan blogger lain atau dengan pengunjung blog mereka.


Guestbook atau buku tamu merupakan salah satu dari kumpulan widget terbaik untuk blog karena widget tersebut cukup populer dikalangan para bloggger. Pada kesempatan kali ini setelah beberapa waktu yang lalu saya telah memberikan cara menambahkan widget jam di blog dan cara memasang lagu di blog yang juga merupakan widget yang paling digemari pengguna blog, saya akan memberikan cara membuat atau memasang buku tamu di blog blogger atau blogspot anda dengan langkah yang mudah dan cepat untuk dilakukan.

Cara membuat buku tamu di blog
1. Kunjungi cbox.ws
2. Daftar dengan klik “Get your own free Cbox now!”
3. Isi form pendaftaran dan pilih model buku tamu yang diinginkan di “style”
4. Klik “create my cbox”
5. Verifikasi email anda dan login kembali di cbox
6. Klik “look & feel”  dan atur buku tamu tersebut sesuai keinginan anda
7. Jika telah selesai mengatur klik “save” dan klik “apply”

Cara memasang buku tamu di blog sesuai keinginan
1. Di member area cbox klik “publish!” dan copy  kode yang diberikan dengan klik “copy to myclipboard”
2. Login ke blogger anda, klik “tata letak” dan “tambah widget” pada posisi yang anda inginkan
3. Pilih “HTML/Javascript”
4. Paste kan kode tersebut dan klik simpan.

Cara memasang buku tamu melayang atau menggantung disisi kanan blog
1. Login ke blogger- tata letak – dan tambah widget
2. Pilih “html/javascript”
3. Pastekan kode dibawah ini di kolom yang disediakan

<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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3WGeySfa0Mtvr3tNez2htGpoGVHERPwaXMXGF1IORu-du4qBpaoS_ss4h5bii2U-mAdem0I_6nZXQdwHRsQHfbBHe_ZpoSNODI_UWKlMBxSYrJjUM7SMJS8HE7jUMkhjPabnrRdzBhHo/s1600/bukutamu.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">
Silakan Pasang Kode Buku Tamu yang sudah di copy tadi Di Sini

<div style="text-align:right">
<a href="http://anonymouslikepeace.blogspot.com">[get this widget]</a>><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></div></div>

4. Ubah tulisan berwarna hijau dengan kode yang anda dapat dari cbox tadi
5. Klik “simpan”