Buku Tamu atau Guest Book merupakan content sebuah web yang cukup diperlukan. Berbagai bentuk dan tampilan banyak disajikan dalam berbagai macam blog, salah satunya seperti yang terdapat dalam blog sahabat saya yang disembunyikan. Seperti apa tampilan buku tamu tersebut ? silahkan sobat lihat dalam blog sahabat saya http://wikilead.blogspot.com.
Untuk membuat Buku Tamu Buka Tutup seperti dalam blog sahabat saya (tersembunyi), berikut adalah langkah-langkahnya:
- Copy script di bawah ini:
- Ubahlah ukuran jarak dari atas, warna bingkai, warna latar, dan judul sesuai keinginan sobat.
- Ubah link gambar/judul yang berwarna biru sesuai keinginan sobat/sesuai link gambar sobat.
- Untuk menaruh Script/code tadi (yg sudah sobat sesuaikan), ada 2 metode penaruhan.
<!-- Mulai GuestBook Buka/Tutup --> <style type="text/css"> #gb{ position:fixed; top:10px; /*jarak dari atas*/ z-index:+1000; } * html #gb{position:relative;} .gbtab{ height:100px; width:30px; float:left; cursor:pointer; background:none; } .gbcontent{ float:left; border:2px solid #000000; /*warna bingkai*/ background:#FFFFFF; /*warna latar*/ padding:5px 10px 0px 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"> <div style="text-align:center;"><a href="javascript:showHideGB()" title="Close/Tutup"><img style="border:0px; width:100px; height:auto;" alt="Guestbook" src="http://i655.photobucket.com/albums/uu275/kanzenk/wikilead/wikiguest.gif" /></a></div><script type="text/javascript" src="http://kanzenkfilehost.googlecode.com/files/guestbook-open-close.js"></script>
</div></div>
<!-- Selesai GuestBook Buka/Tutup -->
- Login kedalam Dashboard akun blogger sobat, pilih Tata Letak - Elemen Halaman.
- Kemudian klik Tambah Gadget dan pilih HTML/Javascript.
- Paste script Buku Tamu Buka Tutup tadi dan jangan diberi judul (title).
- Login kedalam Dashboard akun blogger sobat, pilih Tata Letak - Edit HTML, jangan lupa centang Expand Template Widget.
- Cari kode </head> pada script HTML template blog sobat.
- Paste script Buku Tamu Buka Tutup tadi di bawah kode </head>.
- Setelah itu save
Setelah itu buatlah sebuah link untuk menampilkan Buku Tamu Buka Tutup, seperti berikut :
<a href="javascript:showHideGB()"><img src="http://i655.photobucket.com/albums/uu275/kanzenk/wikilead/wikiguest.gif/> / BUKU TAMU</a>Ubah tulisan yang berwarna BIRU dengan alamat URL Gambar sobat, untuk link kedalam Buku Tamu atau dapat sobat masukan berupa TEXT (warna MERAH)dalam menu.
Begitu mudahnya pembuatan Buku Tamu/GuestBook Buka Tutup ini kan sobat. Selamat mencoba.