Cara Memasang Buku Tamu Tersembunyi 2

Memasang Buku Tamu Tersembunyi

Kalau kamu ga tau lagi mau taruh buku tamu Shobat di mana, buat aja buku tamu  "tersembunyi", dan kalau diklik akan langsung terlihat.
Contohnya shobat bisa lihat di bagian sebelah kanan layar di Blog saya. dan klik tab

BUKU TAMU  dan buku tamu itu akan bergerak keluar, sehingga yang tadinya tidak kelihatan akan jadi terlihat. Lumayan ngirit lahan Sidebar he3….

Caranya:

1. Masuk ke account Blogger kamu, pilih "Layout" kemudian "Page Elements",
2. Klik "Add a Gadget" (yang mana aja oke), kemudian pilih "HTML/JavaScript",
3. Copy-paste kode di bawah ini:

<style type="text/css">

#gb{

position:fixed;

top:2px;

z-index:+1000;

}

* html #gb{position:relative;}

.gbtab{

height:130px;

width:30px;

float:left;

cursor:pointer;

background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjv9PfDAarSJqYPdPwf7ZmNecvn_oG6NJ8ktaSRdj6cW7YTfXhnFfRtiawnx-LUhR7ZtQpsZmMy_2npu57y-CbvVFHbHllod6iJDT2Q2IGN_RDs_k4d637JvhFDwo30WoKCGMqs_xO0ynI/s128/BOOK.png')no-repeat;

}

.gbcontent{

float:left;

border:2px solid #2A0A0A;

background:#610B0B;

padding:5px;

}

</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="mangabbas" src="http://www5.shoutmix.com/?mangabbas" width="250" height="350" frameborder="0" scrolling="auto">

<a href="http://www5.shoutmix.com/?mangabbas">View shoutbox</a>

</iframe>

<br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />

<!-- End ShoutMix -->

<br/>

Mau punya buku tamu seperti ini?<br/>

Klik di

<a href="http://mangabbas.blogspot.com/2011/05/cara-memasang-buku-tamu-tersembunyi.html">

sini (MANG ABBAS)

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

Keterangan :

Warna Ungu adalah : posisi dimana menurut shobat suka

Warna hijau adalah  : kode buku tamu shobat (silahkan diganti)!!

Selesai……

Simpan…. semoga manfaat..