Ingin buat blog sobat jadi tambah ramai dengan menyisipkan Buku Tamu Slide? Kali ini saya akan share bagaimana cara memasang Buku Tamu Slide kayak melayang gitu denk di blog sobat.
Seperti yang terlihat di sebelah kanan halaman ini.
Ada banyak site yang menyediakan aplikasi ini, tetapi yang paling populer itu Shoutmix dan Cbox (seperti yang saya gunakan ini), karena Shoutmix banyak terjadi error saat meninggalkan pesan maka saya gunakan saja yang Cbox-nya.
Untuk mengetahui kisah selanjutnya, langsung saja kita ke TKP...
#Langkah 1
Sobat buat akun dulu di Cbox. Klik di sini.Silahkan isi form yang sudah tersedia.
- Cbox Name : isi nama untuk akun Cbox anda misalnya "aditya". Ini digunakan untuk masuk ke akun anda di Cbox.
- Email Address : masukkan email anda yang aktif.
- Password : password anda tentunya.
- Website : isikan alamat blog sobat, misalnya "http://adityameilaz.blogspot.com".
- Language : sesuai selera. :P
- Style : pilihan untuk model Buku Tamu.
Terakhir klik tombol "Create my Cbox!".
Catatan: jangan lupa konfirmasi di email anda.Setelah konfirmasi email, langsung saja sobat blogger tekan tombol yang berlabelkan "Copy to clipboard".
#Langkah 2
- Login ke blog sobat, kemudian pilih Design >> Page Element.
- Pada bagian halaman, klik "Add a Gadget".
- Pilih gadget HTML/JavaScript dan copas kode di bawah ini :
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:120px;
width:40px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz47EfmOYV2HpcqWTwnGVKBVxILMzozCp-fJ672jHL7UgTHgGuV4z2AsmxB7W8giNJYEJ0qYFR3rYjQ5Ht4UBDPX-87MteMaa-86e8HW_dDRP7jIOVu-Q9_oLCZnWC-4Rpm1veUFllPM-j/s104/guestbook2.png') no-repeat;
}
.gbcontent{
float:left;
border:1px solid #78D0FF;
background: #f6f8f8;
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">
<!-- PASTE KODE BUKU TAMU ANDA DI SINI -->
<center>Pengen Buku Tamu seperti ini??<br/>Klik di <a href="http://dauz-it.blogspot.com/2011/08/memasang-buku-tamu-slide-di-blog-dauz.html" target="_blank" title="Buku Tamu Slide">sini</a></center></div></div><script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
Temukan kata <!-- PASTE KODE BUKU TAMU ANDA DI SINI --> dalam kode tersebut kemudian ganti atau paste dengan kode dari buku tamu yang anda dapat dari Cbox.
#Langkah 3
Inilah langkah yang paling penting dan harus teliti agar Buku Tamu anda berjalan dengan sempurna.Cuma menekan tombol SAVE.
Jangan lupa untuk meninggalkan komentarnya untuk artikel ini yah...
