KANG MASS

Memasang elemen Buku Tamu di blog, selain 'mempercantik blog' juga penting sebagai alat interaksi antara pemilik blog dengan pengunjung atau antar sesama pengunjung blog, namun terkadang pemasangan buku tamu ini menyita sebagian 'space blog', untuk mengatasi masalah ini banyak para blogger telah mempublikasikan 'cara memasang buku tamu diblog secara hiden atau tersembunyi'.

Pada kesempatan ini saya coba menulis artikel tentang Cara Pasang Gadget Buku Tamu di Blog, secara tersembunyi tetapi dengan style seperti 'update status di facebook', untuk memunculkan buku tamu ini, pengunjung blog tinggal mengklik button Buku Tamu yang terdapat di samping kanan halaman blog. Demo-nya bisa anda lihat di sini

Cara Pasang Gadget Buku Tamu ini, silahkan ikuti langkah berikut :

<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://lh4.googleusercontent.com/-fZjSRKf7YE4/T0Wdm2aLTRI/AAAAAAAAA9g/YQVVuGx16No/s100/bukutamu.gif') no-repeat;
}
.gbcontent{
float:left;
border:1px solid #E4E3E3;
background:#8ea88e;
padding:15px;
}
</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"><div style="text-align: center;">Simpan Jejak Anda di Sini..!<span style="color: blue; font-size: x-small;"></span>
</div>
<iframe src="http://www.facebook.com/plugins/livefeed.php?app_id=API Key Facebook Anda&amp;width=280&amp;height=400&amp;xid=API Key Facebook Anda" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:280px; height:400px;" allowtransparency="true"></iframe><div style="color: #999999;">
<div style="text-align:left">
[<a href="javascript:showHideGB()">close</a>]&nbsp;&nbsp;[<a href="http://multipaste.blogspot.com/2012/02/pasang-buku-tamu.html"><b>?</b></a>]
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>

Note :

Jika style buku tamu ala 'update status di Facebook' ini dirasakan kurang cocok dengan style blog anda, maka anda dapat mengganti sebagian script (tulisan yang berwarna biru) dengan script dari situs penyedia layanan shoutbox seperti :

Berikan komentar Anda yang berkaitan dengan artikel dan berkomentarlah dengan bijak. Mohon untuk tidak melakukan SPAM, semoga 'Tali Silaturahim' kita terus terjalin.