. Kali ini saya akan membahas cara membuat (memasang) chatbox/buku tamu di blog. Tetapi ini bukan chatbox biasa lho, yang selalu nongol di sidebar blog. Chatbox yang saya bagikan kali ini memiliki kemampuan untuk melayang pada sisi kanan, membuka dan menutup apabila di klik. Penasaran kan? Silahkan lihat gambar screenshot-nya dulu :
- Sudah dilihat gambar screenshotnya? Jika iya, ikuti langkah – langkah berikut untuk memasangnya di blog Anda : Buka web ChatAngo Yaitu Chatango.com
- Oke Setelah Buka Web Klik "Create Group"
- Jika Sudah Kalian ke halaman NEXT, Isi Formulir tentang chatango yang kamu mau
- Jika Kalian Sudah Atur Seperti apa chat ango kalian , Klik "Continue"
- Isi Biodata Kalian Dengan Tepat Fan benar .
- kalau sudah diisi dengan benar Klik SIGN UP
- Oke selanjutnya Copy Kode Yang seperti Ini ,
Selain menggunakan chatango,kalian juga dapat menggunakan situs bernama Cbox.Caranya hampir sama seperti chatango hanya ada perbedaan sedikit saja.Inilah model bila memakan situs Cbox.
· Lalu Copy kode berikut, dan pastekan kode yang telah Anda copy dari situs chatango pada bagian yang telah ditandai.
<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/AVvXsEhNWwoCgRVcOgMELWZpcJu8DRlVymwXXBuC4Q6zDx8F6e3cxYTcpfyyaj5mXTE5IanMTd5ZXB2787nnqi1NqhECHIltG-LW9I-pWl8UHSxAbCPdy_vwDaPjQM_db6lMpQakgW4WzLOc1_g6/h120/chatbox.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">
Pasang KODENYA DISINI
<div style="text-align:right">
<a href="rizkiwowon.blogspot.com">[sumber]</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>
Selamat mencoba! Jangan lupa untuk meninggalkan komentar, dan tolong juga klik tombol Google+ dibawah. Terima kasih
Posting Komentar