Menyembunyikan Buku Tamu Facebook di Blog

Cara Sembunyikan Buku Tamu Facebook bisa juga dibilangmembuat buku tamu melayang disisi Kiri atau Kanan Blog kita.

Keterangan Mengenai Cara Pasang wajib anda baca di sini --> Cara Pasang Buku Tamu di Facebook

Mempercantik Blog kita dengan berbagai widget / Gadget memang sudah jadi Tradisi, ini demi betahnya pengunjung diblog kita. Namun kadang juga kita bingung mau ditaruh dimana lagi gadget baru kita sedangkan blog sudah penuh dengan pernak pernik.Alternatif yang paling Keren yakni disembunyikan atau dibuat melayang disisi kiri atau kanan, blog.

Silahkan Ikuti Langkah-langkah Berikut Untuk Pemasangannya :

• Tentu Login dulu ke Account Blogger Sobat 
• Silahkan Menuju Dasborlalu Klik Rancanga 
• Pilih Tambah Gadget
• Pada Halaman Tambah Gadget Cari Tab menu HTML/JavaScriptlalu klikTambah
• Sobat Tinggal Mengcopy CODE dibawah ini tanpa tambah apapun dan BUKU TAMU sudah jadi, karena Aplikasinya yang kemaren sudah kita bahas di sini sudah disisipkan... PILIH Sesuai Keinginan MAu diletakkan di Sisi KANAN Atau KIRI .... TINggal Pilih aja sob !!

Kode untuk Sebelah Kanan

<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(’https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg42reIXCRLHUg40GZYnJBlSSrC7hy6g5893piKWg5cOxZ_CzMtWuDqiSQBUalWl9n9mHUPBU1nyydZfI77SzEaRlOVc0WM0PzI6a-Gpmqpv-bs0-VO5OE9nymvSAVzJalGw_iaiXcia08/’) 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"> <div style="text-align: center;"> <span style="color: blue; font-size: x-small;">Selamat Datang</span> <span style="font-size: x-small;"><b style="color: red;">Jgn Lupa Comment</b></span><span style="color: blue; font-size: x-small;"> Terimakasih </span><span style="font-size: x-small;"><b style="color: blue;">Kunjungannya</b></span> </div> <iframe src="http://www.facebook.com/plugins/livefeed.php?app_id=146330885395993&amp;width=290&amp;height=400&amp;xid=355411944445" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:290px; height:400px;" allowTransparency="true"></iframe><div style="color: #999999;"> <span style="font-size: xx-small;">Widget by: <a href="http://www.facebook.com/">Facebook</a> Develop by: <a href="http://imdad-gresik.blogspot.com/2010/08/memasang-buku-tamu-facebook-di-blog.html/" target=’new,>Gubuk Ilmu</a></span> </div> <br/> <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>

Kode untuk Sebelah Kiri

<style type="text/css">
#gb{
position:fixed;top:100px;z-index:+1000;}
* html #gb{position:relative;}
.gbtab{height:128px;width:35px;
float:right;
cursor:pointer;background:url(’https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg42reIXCRLHUg40GZYnJBlSSrC7hy6g5893piKWg5cOxZ_CzMtWuDqiSQBUalWl9n9mHUPBU1nyydZfI77SzEaRlOVc0WM0PzI6a-Gpmqpv-bs0-VO5OE9nymvSAVzJalGw_iaiXcia08/’) no-repeat;}
.gbcontent{float:right;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.left = 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;">
<span style="color: blue; font-size: x-small;">Selamat Datang</span>
<span style="font-size: x-small;"><b style="color: red;">Jgn Lupa Comment</b></span><span style="color: blue; font-size: x-small;">
Terimakasih </span><span style="font-size: x-small;"><b style="color: blue;">Kunjungannya</b></span></div>
<iframe src="http://www.facebook.com/plugins/livefeed.php?app_id=136575963025211&amp;width=290&amp;height=400&amp;xid=355411944445" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:290px; height:400px;" allowTransparency="true"></iframe><div style="color: #999999;">
<span style="font-size: xx-small;">Widget by: <a href="http://www.facebook.com/">Facebook</a> Develop by: <a href="http://imdad-gresik.blogspot.com/2010/08/memasang-buku-tamu-facebook-di-blog.html" target=’new’>Gubuk Ilmu</a></span>
</div><br/><div style="text-align:left"><a href="javascript:showHideGB()">[tutup]
</a></div></div></div>
<script type="text/javascript">var gb = document.getElementById("gb");
gb.style.left = (30-gb.offsetWidth).toString() + "px";
</script>

DEMO nya : Pada Sisi Kiri Atas Monitor Sobat Pada Blog ini

Keterangan :

position:fixed;top:100px;z-index:+1000 = Posisi Tombol Logo Open Close
height = 400px; (untuk ketinggian buku tamu)
width = 290 px; (untuk kelebaran buku tanu)

Silahkan Sesuaikan Keinginan, Tapi Menurut saya itu sudah sesuai
Jika Ada yang tidak berfungsi Mohon Konfirmasi

Terimakasih Sudah Meluangkan Waktu Mampir di Blog Newbie ini... Heeee

Sambil Nunggu Beduk Sahur Selesai Tadarrus ngisi waktu dengan Posting

Menyembunyikan Buku Tamu Facebook di Blog 9 out of 10 based on 10 ratings. 9 user reviews.

Tutorial Blog

• Cara mengganti background Kotak Komentar Blog 1
• Cara Mudah Membuat Random Background Color
• Memperbesar Gambar pada Artikel Blog Dengan jQuery Image Zoom 2.0
• Cara Simple Membuat Script Link Banner Pada Blog Plus Wadah Text Area
• Membuat Slide Gambar Efek Terjatuh Dengan jQuery
• Cara Mudah Auto Hide Dan Menghilangkan Navbar Blogger
• Cara Membuat Slide Gambar Berjalan Pada BLOG
• Cara Mudah Mendeteksi Blog Yang NoFollow atau DoFollow dengan AddOns Mozilla Firefox
• Cara Mencari Blogger Satu Kota atau Satu Daerah
• Cara Memasang Photo Dan Avatar di Kotak Komentar Blogger
• MEnambah Dan Memasang Gadget HTML Code Javascript Pada Sidebar
• Cara Cek Link Yang Rusak Di Blog
• Cara Membuat Kotak Wadah Kode HTML Dengan Warna Pada Postingan
• Cara simpel Membuat Spoiler (Tombol Hide Show Kotak Kode HTML Pada Posting)
• New !! Cara Membuat Related Post Keren Dengan Tampilan Image