cara membuat buku tamu melayang di kanan blog [Edition2]

          Membuat Buku Tamu memang bisa dilakukan dengan berbagai macam cara sob, ada yang meletakkan langsung di sidebar blognya ada juga yang meletakkan dengan Tombol atau gambar floating dan, ada juga yang meletakkan dengan Tombol Pop Up. Tapi Kali ini kami akan mempostingkan Bagaimana Cara Memasang Buku Tamu di Sisi Kanan Blog anda.

Beriku adalah step stepnya :
 
Step Pertama :
Anda Login terlebih dahulu ke akun Blogger Anda

Step Kedua :
Pergi ke Rancangan / Design pada Dashboard Anda

Step Ketiga :
Untuk Meletakkan Buku Tamu Disisi Kanan Blog :
Tambahkan kode HTML / Script di bawah ked widget blog anda (Anda sudah pasti tahu)

<!-- right hidden chatbox by http://www.sobatfauza.co.vu/ START -->
<style>
#hcr {
position:fixed;top:100px;
z-index:+1000;
}
* html #hcr {position:relative;}
.hcrtab {height:100px;width:30px;
float:left;
cursor:pointer;
background:url('http://i1227.photobucket.com/albums/ee440/danghilal/idesainer/shoutbox-1.png') no-repeat;
}
.hcrcontent {
float:left;
border:2px solid #003e82;
background:#f3f6f7;
padding:10px;
}
.hc-credit {font-size:9px}
.hc-credit a {text-decoration:none}
</style>
<script type="text/javascript">
function showHidehcr(){
var hcr = document.getElementById("hcr");
var w = hcr.offsetWidth;
hcr.opened ? movehcr(0, 30-w) : movehcr(20-w, 0);
hcr.opened = !hcr.opened;
}
function movehcr(x0, xf){
var hcr = document.getElementById("hcr");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
hcr.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("movehcr("+x+", "+xf+")", 10);}
}
</script>
<div id="hcr">
<div class="hcrtab" onclick="showHidehcr()"> </div>
<div class="hcrcontent">

Silakan Pasang Kode Buku Tamu sobat yang sudah di copy tadi Di Sini

<br />
<div class="hc-credit">
<span style="float:left">
<!-- THIS CREDIT MUST STAY INTACT FOR LEGAL USE -->
<span >
<span > Get this</span>
<a href=http://www.sobatfauza.co.vu/2013/03/cara-membuat-buku-tamu-melayang-di.html" target="_blank">
<span class="Apple-style-span" > Desaign1</span>
</a></span>
<span style="float:right">
<a href="javascript:showHidehcr()">
[close]
</a>
</span>
</div>
</div>
</div>
<script type="text/javascript">
var hcr = document.getElementById("hcr");
hcr.style.right = (30-hcr.offsetWidth).toString() + "px";
</script>
<!-- right hidden chatbox by http://www.sobatfauza.co.vu/ END -->

Note : Ganti Kode yang berwarna hijau dengan kode buku tamu / shoutbox Anda

Step yang Terakhir :
Simpan Template dan Lihat Hasilnya ....

Sekian langkah-langkahnya, Jangan lupa dipasang ya ..
Terima Kasih