1. Login Blogger.
2. Masuk ke bagian Rancangan/Tata Letak
3. Klik Add a Gadget
4. Pilih HTML/Java Script
5. Masukan kode di bawah ini:
<style type="text/css">
#gbs{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gbs{position:relative;}
.gbtabs{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('bukutamuright.png') no-repeat;
}
.gbcontents{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGBs(){
var gbs = document.getElementById("gbs");
var w = gbs.offsetWidth;
gbs.opened ? moveGBs(0, 30-w) : moveGBs(20-w, 0);
gbs.opened = !gbs.opened;
}
function moveGBs(x0, xf){
var gbs = document.getElementById("gbs");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gbs.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGBs("+x+", "+xf+")", 10);}
}
</script>
<div id="gbs">
<div class="gbtabs" onclick="showHideGBs()"> </div>
<div class="gbcontents">
<!--- Put Your code Start here --->
<!--- End here--->
<div style="text-align:right">
<a href="javascript:showHideGBs()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gbs = document.getElementById("gbs");
gbs.style.right = (30-gbs.offsetWidth).toString() + "px";
</script>
6. Simpan dan lihat hasilnya.
Selamat mencoba....
