Membuat Buku Tamu Pada Blog

Walau pun sudah ramai yang membahas posting saya kali ini, tapi tidak ada salahnya saya memposting artikel Membuat Buku Tamu Pada Blog untuk melengkapi daftar isi opret blog pada blog saya. Semoga saja bisa membantu para sobat yang masih belajar didunia blog.

Guna Buku Tamu pada blog kita adalah sebagai fasilitas untuk berinteraksi dengan pengunjung blog anda. Untuk yang ingin membuat Buku Tamu Pada Blognya, silahkan ikuti langkah dibawah ini.

Langkah-langkah :

1. Masuk ke account Blogger kamu, pilih "Layout" kemudian "Page Elements",
2. Klik "Add a Gadget" dan pilih "HTML/JavaScript",
3. Masukkan kode di bawah 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('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">

<!-- Masukkan kode buku tamu anda -->

 
<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

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

</div>

Pada kode di atas, cari kode <!-- Masukkan kode buku tamu anda --> dan ganti kode tersebut dengan kode buku tamu yang anda dapatkan dari situs Shoutmix atau Cbox

Anda juga bisa atur posisinya. Ubah aja nilai atribut top:50px. Kalau mau lebih ke atas dikit, ubah jadi 30px atau 20px.

Semoga sukses