Cara Mudah Membuat Buku Tamu Melayang di Blog

Cara Mudah Membuat Buku Tamu Melayang di Blog - Assalamualaikum sobat blogger, pada postingan kali ini madhi share info tentang Cara Membuat Buku Tamu Melayang di Blogspot. Ini adalah salah satu cara untuk mempercantik tampilan blog kita, tapi perlu di ingat sob, gak semua pengunjung/visitor suka dengan hal ini. Banyak juga yang merasa terganggu dengan adanya buku tamu melayang-layang kaya setan gini, hehee tapi kalo sobat mau coba ya silakan saya tidak akan melarang, hehe

Buku tamu merupakan salah satu hal yang penting juga di dunia blog karena dengan adanya buku tamu pengunjung blog kita dapat menyampaikan keluh kesah, kritik dan saran dan lainnya tentang blog kita jadi antara pengunjung dan pengelola blog ada interaksi. Akan tetapi kalo buku tamu kita letakkan di sembarang tempat kadang juga mengganggu pemandangan nah kalo di letakkan di pinggir sisi kanan atau kiri kayaknya itu lebih memperindah. Ya itu semua tergantung selera masing-masing si :D
Oke langsung saja ke TKP mari kita mulai Membuat Buku Tamu Melayang, silahkan sahabat lakukan langkah langkah dibawah ini :

1. Login ke Blogger sobat masing-masing

2. Pilih Tata Letak

3. Lalu tambahkan Gadget baru atau Widget Baru "Add Gadget"

4. Setelah itu pilih HTML/Javascript

5. Copy kode dibawah ini dan letakan kedalam Widget yang telah sahabat buat.
 <style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:142px;
width:60px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsD0xoLQP4s3ixSCeguafKjgtsUpQn60H1S5gyHPnROl4NMixm3Nc_o1CjBUgXwSS7D3w7xaz0QovgI78YWS2CnzZMNPQHBTJuFLMlL4AoKg_MpFDbwky5iLHzW17-ZaSd5Ybmpip5Jos/s1600/chat+customer+service.png ') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #ff8000;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 60-w) : moveGB(50-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">

MASUKAN KODE BUKU TAMU SOBAT DISINI YA

<div style="text-align:right">
<a href="http://bit.ly/Ktz2ZT">BelajarMendesainBlog</a>><a href="javascript:showHideGB()">(BUKA)</a>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Keterangan :
Silahkan sahabat ganti MASUKAN KODE BUKU TAMU SOBAT DISINI YA dengan kode Buku Tamu milik sahabat.

6. Save

Demikianlah info mengenai Tutorial Membuat Buku Tamu Melayang di Blogger.com, semoga bermanfaat sob dan jangan lupa buat ninggalin jejak di kolom komentar yang tersedia. Thanks for visiting our blog :)