Cara Membuat Hiden Buku Tamu Di Blog

Cara Membuat Hiden Buku Tamu Di Blog -  Buku Tamu merupakan salah satu tempat atau wadah yang hampir serupa dengan Shoutbox seperti sebelumnya yang pernah sudah saya posting juga. Baca artikelnya di Cara Membuat Shoutbox Keren Dan Mudah Di Blog.
Buku tamu juga bisa dijadikan sebagai tempat untuk perkenalan, sapaan, serta juga bisa difungsikan sebagai tempat untuk blogwalking. Berikut tampilannya :

Cara Pemasangannya :

• pilih Rancangan (design)
• pilih tambah Gadget(Add a Gadget)
• pilih HTML/JavaScript, ada tampilan seperti ini:
• Copy semua kode script yang ada dibawah ini :

<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://i627.photobucket.com/albums/tt356/hanjoyo/BUKUTAMU.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #0000ff;
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">
<!-- Ganti ini dengan kode buku tamu kamu -->
<br/>
Mau punya buku tamu seperti ini ?<br/>
Klik di >>
<a href="http://joe-ngeblog.blogspot.com">
Han's Tutorial Blogger Pemula
</a>
<div style="text-align:right">
<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>

*Mau punya buku tamu seperti ini ? = Ganti sesuai dengan kata yang anda inginkan.
*http://joe-ngeblog.blogspot.com =  Ganti dengan URL sobat sendiri

• Kemudian save.. dan lihat hasilnya diblog sobat.
  
  semoga sukses dan bermanfaat :).

Share this post