Cara Membuat Buku Tamu Tersembunyi

Berikut ini adalah langkah2 untuk membuat Buku Tamu tersembunyi :

1. Masuk ke account blog Anda.
2. Pilih Tata Letak >> Elemen Halaman >> Tambah Gadget [dimana aja bisa], kemudian pilih "Html/Java Script". Catatan : klo aq taro kode ini tepat di bawah header, spy loading-nya lbh cepat...
3. Kemudian COPAS (copy and paste) kode berikut :

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

<!-- Taruh Kode Chat Mu Disini -->

<br/>

<div style="text-align:right">

<a href="javascript:showHideGB()">

[close]

</a>

</div>

</div>

</div>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.right = (30-gb.offsetWidth).toString() + "px";

</script></div></div>

CATATAN :

* Pada kode diatas, ganti kode <!-- Taruh Kode Chat Mu Disini-->  dengan kode Buku Tamu Anda yg diberikan oleh penyedia-nya, misalnya dr CBox, ShoutBox, Oggix, ShoutMix, dll.
Btw, kode ini hrs persis/lengkap spt yg diberikan oleh penyedia-nya, jgn sampe ad yg kurang sedikitpun. 

* Kode ini :http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.pngadalah "Tab Code" ataw tombol Buku Tamu, kalau ingin tombol Anda sendiri tinggal hapus kode tersebut dan ganti dengan kode Anda sendiri. 

Kalo aq, aq bikin sendiri dulu model tombolnya, pake MS-Word, truz q insert di MS-Publisher, dan q 'Save As Picture' dan q upload ke PhotoBucket, baru q pake alamat di PhotoBucket sebagai pengganti link tsb. Pusing? Yawdah, pake tombol dr link itu az... Btw, klo tar ad wkt dan pengen nyoba2 sndiri, bisa dicoba cara aq... 

* Kalau ingin mengubah posisinya ke atas sedikit, ubah kodetop:50px; dengan mengganti angka 50 dengan keinginan Anda, contoh 30px. Klo aq pake 5px, spy gak trlalu ke bwh.

* Okelah, kalaw begituw... selamat mencoba, smoga tutorial ini bermanfaat .... semoga hari ini jga menyenangkan bwt Anda... have a nice day, everyone... I luv y'all.... mmmmmuuuuuuaaaaacccchhhh...

* Special thanks for my friend >> Rizal Saputra, yg telah memberi inspirasi tutorial ini... sukses aja bwt kang Rizal... Oooyyyeeee...

Artikel Terkait:

Posted in: Tutorial Blog