Memasang CBOX (buku tamu) di Blogger

Tadinya aku bingung, gimana masang 'emotion' di kotak chat (cbox) , tapi setelah keliling dunia ternyata dapet juga ni artikel. Tapi kebanyakan artikelnya sulit untuk kuikuti (maklum "gatekh"...), jadi tutorial yang disini sengaja kubuat pake gambar (siapa tau ada orang yg seperti saya....gatekh juga)

Yu' kita buat :

Daftar disini klik Sign Up. Isi data-data anda >>> konfirmasi melalui email masuk.

Kalo udah terdaftar, kemudian kita Login >>> Option >>>Smilies

kemudian akan tampil seperti ini :

sampe' sini STOP dulu....buka New Tab dengan Firefox (halaman baru), masuk kesini disini 33smiley..Nah...banyak gambarnya kan...

Pilih gambar yang mau kita masukkan >>> Klik kanan pada gambar >>> Properties >>> Copy alamat situsnya >>> dan Paste kan ke dalam cbox, lihat gambar dibawah :

Tanda "x" sebelah kanan untuk menghapus....kalau kita pastekan kedalam langsung ada "Preview"nya disebelah kiri. Kotak "code" harus kita isi (:b atau :c terserah) yg penting diisi. Kotak "alt.code" kosongkan saja, bila sudah selesai semua kemudian simpan dan lihat hasilnya. (lucu kan...)

Nah....Kemudian untuk membuat agar cbox kita tersembunyi di sebelah kanan (apabila di klik baru muncul)...caranya seperti ini :

1. Login ke Blogger Account Anda, pilih "Layout" kemudian "Page Elements",
2. Klik "Add a Gadget" boleh di element manasaja, pilihlah "HTML/JavaScript",
3. Copy-paste kode di bawah :

<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">


<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe frameborder="1" marginheight="2" marginwidth="2" height="200" src="http://www7.cbox.ws/box/?boxid=46036&boxtag=eb73nb&sec=main" id="cboxmain" scrolling="auto" style="border:#DBE2ED 1px solid;" width="300" allowtransparency="yes" name="cboxmain"></iframe></div>
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="75" src="http://www7.cbox.ws/box/?boxid=46036&boxtag=eb73nb&sec=form" id="cboxform" scrolling="no" style="border:#DBE2ED 1px solid;border-top:0px" width="300" allowtransparency="yes" name="cboxform"></iframe></div>
</div>

<a href="http://bit.ly/3KeJ9c">|</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>

Kemudian Simpan....Tempatnya dimana saja..terserah kita.
Yang diganti hanya Tulisan berwarna merah , karena itu adalah Script cbox milik kamu.
hasilnya :