Cara Membuat Buku Tamu Tersembunyi

Membuat Buku tamu tersembunyi dapat membuat Buku Tamu-mu malah tambah menarik. Contohnya: Seperti Blog ini.

Coba Kamu klik Tab berwarna Hijau tersebut maka akan keluar Kotak Persegi panjang beserta Buku tamu tersebut, sehingga yang tadinya tidak kelihatan menjadi Terlihat.

Tertarik Mencobanya? Lihatlah Tutorialnya dibawah ini!

1.Masuk Ke Akun Blogger Kamu. Lalu menuju Ke Rancangan --> Elemen laman --> Tambah Gadget --> HTML/ Java script.

2. Lalu masukkan kode dibawah ini pada kotak "Konten".

<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/AVvXsEjhaT5TIMiHmwkXWaryD43m__acjAkrHGVuYLqZVFtpUJ6FnawZ9yZUsmWAnuq75DwFHkPqEJWnYlvht8bZvDIDcF_2NdDdvKlMmiKeTEdbC77Cih3PQsoxFglWRV9idfzJAu17ZXO1-ZDp/') 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">

<!-- Ganti ini dengan kode buku tamu kamu -->

<br/>

Mau punya buku tamu seperti ini?<br/>

Klik di

<a href="http://badarmiftah.blogspot.com/">

sini (Badar 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>

3. Lalu ganti Tulisan "Ganti ini dengan kode buku tamu" dengan Kode HTML-nya Buku tamu punya kamu.

4. Kamu juga bisa atur posisinya. Ubah saja nilai Atribut top-nya. Kalau mau lebih atas sedikit ubah jadi 30 px atau 20 px, terserah kamu.

Catatan: Kode diatas ada kode backlink ke posting ini, kalau kamu berbaik hati, tolong backlink-nya jangan dihapus, ya! :)

Semoga berhasil.....