cara membuat buku tamu di blog

mau punya buku tamu yang tersembunyi atau melayang seperti yang saya punya (jika ingin melihatnya disebelah paling kanan atas blog saya berwarna hijau )dan akan terbuka dan tertutup jika kita meng kliknya saja,berikut langkah-langkahnya :

1. login ke blog anda dan akan mncul didashboard lalu pilih tata letak
2. lalu pilih elemen laman dan pilih tambah gadget tetu saja dengan di klik...
3. lalu muncul banyak gadget pilih gandet yang bernana html/javascript
4. pada gadget java scrip yang telah kita buat tadi tambahkan kode berikut ini

lihat script

<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/AVvXsEgY-mIgSs-Am1LswNxq98vH292TpGM7peRhu_XogX1nzXmYcMje_kUAyvChjGcMKnEfr3POi9q1PCvVMgTx9BuzjNtCvYjetznjwYXhVTXRzFU7NHj9ntip3774mljXu_nCXyd7kCyUIJwo/') 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">

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="tokoaslionline" src="http://www5.shoutmix.com/?tokoaslionline" width="180" height="400" frameborder="0" scrolling="auto">
<a href="http://www5.shoutmix.com/?tokoaslionline">View shoutbox</a>
</iframe>

<!-- End ShoutMix -->

<br />
Mau punya buku tamu seperti ini?<br />
Klik di
<a href="http://tokoaslionline.blogspot.com/2009/07/membuat-buku-tamu-tersembunyi.html">
sini (Info Blog)
</a>

<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>

6. tapi sebelumnya ada beberapa kode diatas harus diganti dengan kode yang anda dapat dari shoutmix.com ,binggung...tenang saja saya sudah menandai script yang harus diganti dengan background biru coba anda silahkan lihat lagi script diatas.

5. jika sudah selsai perintah ke 5 maka lakukan save dan lihat hasilnya.. :)

semua tutorial yang dibuat diblog ini sudah dilakukan pengujian dan 100% berhasil,jika ingin mengcopy artikel ini keblog anda sertakan alamat blog ini

Artikel Menarik Lainnya: