CARA MEMBUAT BUKU TAMU TERSEMBUNYI DI SISI BLOG

Kali ini, saya akan share tentang tutorial Blogger yang banyak di minati para Blongger yaitu memasang Buku Tamu/Guestbook di Blog. Buku tamu selain untuk mempercantik tampilan blog juga berfungsi sebagai tempat visitor berkomentar dalam suatu blog. Kita akan dimudahkan untuk berkomunikasi atau berintraksi dengan visitor melalui buku tamu ini. Bagi kamu yang berminat untuk mencoba widget buku tamu ini, Ikuti langkah-langkah di bawah ini :

1. Kamu kunjungi dulu ke Cbox
2. Daftar disana atau bisa klik disini, setelah berhasil daftar, login ke Cbox dengan akun kamu tadi
3. Setelah itu, kamu isikan data-data yang di perlukan, dan copy kode HTML buku tamunya..
4. Langkah selanjutnya, masuk ke akun Blogger kamu
5. Pilih Tata Letak > Tambah Gadet > HTML/JavaScript.
6. Copy kode berikut, dan pastekan di box HTML/JavaScript.

<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/AVvXsEj53KosTpE_ZHeuP6w34vez_b18FliADKg_yjGnlnciL00h0k0Us4mLdudbmuUb-7Q1BgSo4xEYGrlPqTR9Hd5ZibBX_Ywf4emR2yu7NZ7VPLjExHLk1Z7oMvRuBdVjAIs3SikSCrYM-CM/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">

<!-- BEGIN CBOX - www.cbox.ws - v001 -->

<div id="cboxdiv" style="text-align: center; line-height: 0">

<div><iframe frameborder="0" width="200" height="305" src="http://www3.cbox.ws/box/?boxid=3415476&amp;boxtag=e5qqhs&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain3-3415476" style="border:#ababab 1px solid;" id="cboxmain3-3415476"></iframe></div>

<div><iframe frameborder="0" width="200" height="75" src="http://www3.cbox.ws/box/?boxid=3415476&amp;boxtag=e5qqhs&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform3-3415476" style="border:#ababab 1px solid;border-top:0px" id="cboxform3-3415476"></iframe></div>

</div>

<!-- END CBOX -->

<div style="text-align:right">
<a href="http://hilbramkurnia3.blogspot.com/2013/03/cara-membuat-buku-tamu-tersembunyi-di-sisi-blog.html">.: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>

Catatan: Ganti kode atau tulisan  yang berwarna biru, dengan kode HTML Cbox yang sudah kamu dapat di langkah no. 3

7. Setelah selesai, klik Simpan....

Kode script di atas kamu bisa ubah sesuai selera kamu sendiri dan tunjukan kreasimu.. Sekian postingan kita pada hari ini, semoga bisa membantu dan jika ada kekurangan kami mohon maaf. Semoga Bermanfat.......