Wednesday, June 09, 2010

Gadget Buku Tamu Melayang



Gadget buku tamu melayang yaitu buku tamu yang melayang diatas halaman blog kita, ada tab dengan tulisan buku tamu kalau mau ditampilkan tinggal klik tabnya maka buku tamunya akan muncul.

Caranya sebagai berikut :

1. Login ke blogger > tata letak > elemen laman > tambah gadget > html/javascripts.

2. Copas kode dibawah ini ke dalam gadget html/javascripts tadi.
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:150px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i466.photobucket.com/albums/rr22/wong284/GuestBook.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #FFFFFF;
background:#FAFD03;
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">

Paste kodenya disini

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></center></div></center></div></div></div>
Ket.
Merah, gantilah dengan kode gadget buku tamu yang akan kamu tampilkan, misalnya kode gadget Shoutmix.

border, warna pada border konten
background, warna pada isi konten.

4. Simpan dan lihat hasilnya.


Selamat Mencoba.



44 comments:

  1. Pebisnis > menuju TKP gan... alias kt4 mu :D

    ReplyDelete
  2. Trik yang baguss mas.. btw, lama dah ga mampir yoww... hehhe. keep blogging!

    ReplyDelete
  3. mantaf ni mas... blog saya blm ada :( ...

    ReplyDelete
  4. wah nice nih sob,..
    thanks y dah d share.
    ntr deh ane praktekin.. :D

    ReplyDelete
  5. tutotialnya sip, pengen ikut nyoba juga
    thanks udah di share

    ReplyDelete
  6. akhatam > repost ini tapinya gan.. =))

    zakas > kalo begitu silahkan dicoba gan.. :D

    odonk's > silahkan dipraktekkan sob.. ;)

    mixedfresh > coba aja agan.. :D

    ReplyDelete
  7. tomo > repost itu gan.. udah dari dulu wa sharing ilmu.. ;)

    uswah > ntar wa kunjungan jg kt4mu n komeng.. tunggu yaa gan.. :)

    ReplyDelete
  8. nice tips mas...
    ada contohnya gak??

    ReplyDelete
  9. Komputer Tips > kan ada contohnya di postingan.. oke gw kasih lagi Contohnya liat disini > websiteecak2.blogspot.com =))

    ReplyDelete
  10. nice hehe oya salam kenal yaaa :) linknya aku sudah pajang di FOUR DREAMS + follow. lakukan sebaliknya yaaa sob :)

    ReplyDelete
  11. four dreams > udah wa follow gan.. and linknya sudah gw pasang di Blogroll di abjad " E ".. :)]

    ReplyDelete
  12. saya kira buku tamunya meLayang-Layang beneran, suLit dong untuk ngisinya. hehehehe... piss ach (canda-red).
    terima kasih atas informasinya, saLam persahabatan dikunjungan perdana.

    ReplyDelete
  13. om_rame > gyahahaha :D ..bisa aj lo gan.. salam blogger gan.. ;)

    ReplyDelete
  14. kunjung kembaLi untuk mengucapkan, terima kasih atas foLLow baLiknya.

    ReplyDelete
  15. mantab bang Andi, kalau saya masih pakai yang bisa ngumpet tuh ...

    ReplyDelete
  16. om_rame > sama2 gan.. thx jg.. :D

    Warna Tulisan > itu sama aja johnson kyk buku tamumu..masih ngumpet jg :))

    ReplyDelete
  17. wah keren nih, mantaf gan tutornya, kayaknya blog nih bisa dapat tutor award deh

    ReplyDelete
  18. bacanya sambiL meLayang-Layang nih.
    ----------------
    sepi nih dunia bLogging, Lagi pada nonton word-cup kaLi yah.
    mohon maaf agak teLat ngabsen.

    ReplyDelete
  19. Kampreto > ntar wa mampir kt4 u n komeng jg.. tunggu gan.. ;)

    Never Give Up Dude | Leader Street > wew.. bakal dpt award yaa.. :D hehe

    om_rame > wkwkwk.. awas gan ntar nabrak widgetku kalo kamu BW-nya melayang2... XD

    secangkir teh dan sekerat roti > Mantaaab yaa ;)

    ReplyDelete
  20. kunjungan pagi, menunggu tutoriaL terbarunya.
    seLamat beraktifitas di awaL pekan ini, semoga bertambah sukses. saLam persahabatan.

    ReplyDelete
  21. Boleh juga tuh biar lebih atraktif dan lebih hidup..

    Hehehehehehehehe......

    ReplyDelete
  22. om_rame > salam pershabatan gan ;)

    ToPu > betul gan.. :D

    ReplyDelete
  23. This comment has been removed by a blog administrator.

    ReplyDelete
  24. contoh nya udah dax ada gan

    ReplyDelete
  25. tengkiyu u tutorialnya..., mau coba juga nih. lam kenal u semua

    ReplyDelete
  26. wah bagus nihh sobbb,,,baclink yaaa,,,,

    ReplyDelete
N.B.
1. Berkomentarlah dengan sopan.
2. Dilarang membuat spam, terutama yang mengandung SARA/ Pornografi/ Judi dan Iklan.