CARA MEMBUAT BUKU TAMU ATAU WIDGET TERSEMBUNYI

Membuat kotak chat tersembunyi adalah sudah umum dikalangan blogger namun bagi pemula masih belum akrab karena letak kotak chat tersembunyi di sisi laman atau blog.Akhy bisa lihat tulisan fb follow disamping kanan atas itulah yang sedang abdur maksudkan,keuntungan trick ini adalah mudah mengingatkan pembaca pada widget ini sebab tempatnya yang unik yang lain daripada yang lain.Caranya cukup mudah pertama masuk pada Dasbor kemudian masuk Rancangan pada Elemen laman cukup menambahkan gadget dan pilih HTML/javascript.Kemudian copy kode dibawah ini oh ya sebelumnya tentukan widget apa yang akan disembunyikan jika widget chat seperti shoutbox maka sebelumnya persiapkanlah javascipt kode shoutbox yang sebelumnya diperoleh dari pendaftaran pada penyedia chatbox itu.Setelah siap masukkan dulu kode ini kedalam kotak Html/javascipt tambahan tadi.

<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://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">


taruh kode shoutbox mu disini!!




<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
<a href="http://www.abdur-rozak.co.cc/2011/05/cara-membuat-buku-tamu-atau-widget.html
''>by Abdur</a>
</div>


</div>


</div>


<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Ganti kalimat 'taruh kode shoutboxmu disini' menjadi kode javascript yang tadinya disiapkan.

Setelah siap simpan gadget dan tidak perlu repot untuk mengatur tata letak sebab yang terlihat dilaman hanyalah tombol kotak seperti pada tombol fb follow di atas.Oh ya akhy gadgetnya jangan diberi judul supaya judul itu tidak terlihat disidebar akhy.