Cara Membuat Buku Tamu Di samping BLOG

JANGAN LUPA FOLLOW BLOG REP

Penasaran dengan Buku tamu yang ada disamping blog ? Kalo penasaran silakan sobat lihat sendiri contohnya di blog sobat REP ini,Coba sobat amati bagian kanan atas blog tersebut, disitu terdapat image Bertuliskan Buku tamu dan coba sobat klik image tersebut,setelah di klik maka sebuah buku tamu akan muncul.

Tertarik untuk membuatnya ? Jika tertarik silakan ikuti langkah-langkah Cara Buat Buku Tamu Berada Disamping Blog di bawah ini.

Cara Buat Buku Tamu Berada Disamping Blog

1.Login ke blogger.

2.Klik Tatat Letak.

3.Klik Tambah Gadget.

4.Pilih HTML/javascript.

5.Copy dan paste Kode di bawah ini ke dalamnya

<style type="text/css">#gb{
position:fixed;
top:25px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:150px;
width:30px;
float:left;
cursor:pointer;
background:url('http://farm3.static.flickr.com/2771/4442306534_c1431ea4ce_o.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #1300F2;
background:#FFFFFF;
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">
MASUKAN KODE BUKU TAMU DISINI
<a href="javascript:showHideGB()">
</a></div>
<div style="text-align:right; font-size:xx-small;">Cara Buat Buku Tamu <a href="http://klinik-it.blogspot.com/2010/03/cara-buat-buku-tamu-berada-disamping.html" target="blank">disini</a><br/><br/> widget by <a href="http://www.klinik-it.blogspot.com" target="blank"> Klinik-it</a>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

6.Hapus tulisan MASUKAN KODE BUKU TAMU DISINI yang berwarna biru dan ganti dengan kode buku tamu atau shoutmix blog kamu.

7.Klik SIMPAN.

8.Selesai...