Cara Membuat Buku Tamu Melayang di Kanan Blog

Di postingan kali inisaya akan berbagi

Cara membuat buku tamu  melayang di kanan blog

1. Langkah Pertama  pergi ke Cbox
2. Lalu masuk akun Cbox atau jika belum punya daftar ke Sign Up Cbox
3. Jika Sudah mendaftar Cbox lalu pemirsa disuruh masuk Cbox
4. Setelah sudah masuk edit sendiri Cbox anda sendiri
5. Menu PUBLISH untuk melihat kode buku tamu
6. Menu LOOK & FEEL untuk mengedit buku tamu

Langkah berikutnya Copy-Paste HTML dibawah ini

Klik show untuk melihat

<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/AVvXsEhXCG2cz2SZgIcjekTg0Tg9PrBf8vSpcZZksjWkSltc2FVG8zp0XM-4zn9AuiJMCiFDcBInMq6Embg4afVtjvib2sHZFdOxnp5kJbCfQS0Nupgc7FfoWpBInZyVv1PkETptthcyYJJPVhA/s1600/bukutamu.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">
Silahkan Pasang Kode Buku Tamu yang sudah di copy tadi Di Sini

<div style="text-align:right">
<a href="http://abelavriyanno.blogspot.com/2012/04/cara-membuat-buku-tamu-melayang-di-sisi.html">[get this widget]</a>><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></div></div>

Pada tulisan berwarna Hijau adalah alamat gambar Buku tamunya, jika kamu ingin menggantinya silahkan copy link dibawah ini

Klik Button / Tombol dibawah ini

http://s26.postimg.org/o0rgja04l/bukutamu2.gif

http://s26.postimg.org/4pai6fcbp/bukutamu3_1.png

http://s26.postimg.org/c7tnf23ol/bukutamu4.png

http://s26.postimg.org/7ag2ty1ph/bukutamu5.png

http://s26.postimg.org/4dt1tnvvp/Bukutamu6.gif

http://s26.postimg.org/rmx9vx6hx/bukutamu9_2.png

http://s26.postimg.org/vfgsbnm05/cats4.png

http://s26.postimg.org/kifgmvz8l/gustbook02_1.png

Pada tulisan berwarna MERAH  silahkan anda ganti dengan kode Buku Tamu yang telah anda Buat tadi di CBOX.


Cara menginput kode html di atas ke blog 

1. Masuk akun blogger anda
2. Ke tata letak
3. Add gadget atau Tambah gadget
4. Edit html/javascript
5. Masukan Kode  html di atas
6. Selesai.