Rabu, 11 Agustus 2010

Cara Menyembunyikan Widget Buku Tamu Di Blog Anda

“Bagaimana cara menyembunyikan Buku Tamu?”
“Apakah bisa?”

Ya, memang bisa! Semuanya bisa kita lakukan. :)

“Tapi, bagaimana caranya?”

Mudah. Simak dan ikuti saja artikel ini! :)

“Baiklah!”

Haha.. Sedikit percakapan pendek di atas tadi yang mendeskripsikan apa yang akan dibahas Blog Doodey kali ini! Sebelumnya saya pernah menulis artikel tentang “Cara Memasang Buku Tamu Di Blog”. Jika ada yang belum baca, ayo silakan baca dulu disini ! :)

Mungkin sebelumnya Anda pernah melihat widget buku tamu yang disembunyikan oleh Admin sebuah blog, yang terkadang ditempatkan di sisi kiri atau di sisi kanan. Lantas, pasti Anda akan segera bertanya, bagaimanakah caranya?

Nah, untuk kali ini saya akan membagi sedikit tips buat para blogger yang masih bingung tentang cara menyembunyikan widget buku tamu di blog Anda. Baik, ikuti saja langkah-langkah berikut! :)

  1. Seperti biasa, Anda Login dulu ke Blogger
  2. Pilih Layout
  3. Kemudian klik Page Elements
  4. Klik Add a Gadget (boleh di elemen mana saja), lalu pilih HMTL/JavaScript
  5. Lalu copy paste kode di bawah ini dan tempatkan di HTML/JavaScript tersebut

<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://i142.photobucket.com/albums/r81/gusdiwanto/tab.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">
<!-- Ganti ini dengan kode buku tamu kamu -->
<font size="2"><a href="http://uda-ei.blogspot.com/2009/08/menyembunyikan-buku-tamu-atau-shoutbox.html">Blog Doodey</a>
<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>

Note:
Tulisan yang saya beri warna biru, ganti dengan kode buku tamu yang sudah Anda dapatkan dari situs buku tamu yang Anda pakai.
Anda juga bisa mengatur posisinya. Ubah saja nilai atribut topnya. Kalau mau lebih ke atas sedikit, ubah menjadi 30px atau 20px, terserah Anda juga.

Sudah ngerti kan caranya? Hehe.. :)

Semoga tips tentang cara menyembunyikan widget buku tamu di blog Anda ini dapat bermanfaat dan membantu Anda. Jika ada yang ditanyakan dan ingin memberikan saran, silakan cantumkan di kotak komentar! :)

Terima kasih.

Tidak ada komentar:

Posting Komentar

Catatan: Hanya anggota dari blog ini yang dapat mengirim komentar.