Cara Pasang Hidden Buku Tamu/cBox/Shoutbox Pada Blog

Cara Pasang Buku Tamu Tersembunyi / Hidden ShoutBox, sebenarnya tips ini sudah basi, alias sudah banyak para blogger membahasnya dalam posting mereka, tapi sekedar mengingatkan kembali aku coba untuk mengulang posting tentang Cara Pasang Buku Tamu Tersembunyi / Hidden ShoutBox. Shoutbox atau shoutmix yang terletak di setiap web/blog adalah sebuah widget atau fasilitas antar muka antara pengunjung blog dengan yang punya blog atau sering disebut sebagai Admin web/blog tsb.

Buku Tamu menurutku adalah widget yang penting ada di web/blog kita, sebab dengan media ini kita bisa berinteraksi dengan pengunjung blog, sehingga akan tercipta interaksi yang akan menjalin silahturahmi antara pemilik blog atau antara pengunjung blog, ujung-ujungnya widget ini juga akan mendatangkan traffic untuk blog.

 1. login ke blogger dahulu
 2. Masuk ke "Rancangan"
 3. Klik tambah widget

 4. Klik HTML/JavaScript

 5. Copy kode 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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPjXJPyjuc3QtmrRHj_Sicbb49NCLSU_OuFHrWXUxgqlaTpdPvlkmK4u-Td_-fAJTr3neUbqbjgZkKiiQA26NmetnW8MxdGP1nuYdQQxT7wZnI1hHp1C0ImYhxj5onAz03HFKcDD42C3TC/') 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">

Ganti tulisan ini dengan kode buku tamu / cBox / ShoutBox Sahabat disini

<div style="text-align:right">
<a href="http://rangga-hadi.blogspot.com/2010/02/cara-pasang-buku-tamu-tersembunyi.html">[get this widget]</a>><a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>

 5. Silahkan Utak-Atik posisi widget dan lain lain

 6.Simpan dan selesai

 Cukup mudah kan 

Semoga Ilmu Ini Bermanfaat