Cara Membuat ChatBox Tersembunyi Pada Blog

Assalamualaikum Wr. Wb.

Salam blogger jumpa lagi dengan Mr. Kodok , kali ini Mr-Kodok akan membahas tentang tata Cara Membuat ChatBox Tersembunyi Pada Blog. Jika anda lihat di Blog saya juga anda bisa melihat di pojok kanan atas, ada sebuah Chat Box (Open Chating) berwarna merah. Tapi kali ini yang saya postingkan adalah cara membuat Chat Box yang muncul tanpa di klik (hanya menunggu cursor lewat). Dengan tutorial ini anda dapat mempercantik Blog sehingga banyak orang yang tertarik dan betah berada di Internet. Cara ini tidak perlu menggunakan software.

Cara buat chat box Ini sangatlah mudah, tapi maaf Tips Blogger ini khusus pemilik blog blogsot.  Berikut adalah langkah-langkahnya :

1. Login ke blogger.com

2. Klik Design atau Rancangan

3. Lalu klik Tambah Gadget

4. Pilih HTML/Javascript

5. Masukkan kode di bawah ini di area HTML/Java Script.

6. Jangan lupa masukkan kode Chat Box anda di tempat yang bertuliskan "Kode Chat Box anda di sini".{untuk mendapatkan kode buku tamu anda, daftar dulu keCBOX.WS }. Jika belum tau caranya silahkan klik di sini

<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}
.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://i1042.photobucket.com/albums/b429/Farix_2010/Chatting.png') no-repeat;
}
.gbcontent {
float:left;
border:1px solid #BB0000;
-moz-border-radius-bottomleft:10px;
-webkit-border-radius-bottomleft:10px;
-o-border-radius-bottomleft:10px;
-khtml-border-radius-bottomleft:10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 10px;
background: #000000url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIHHbDrTQ0-lip88KoSJ934M8nP5Tv52HG-h6Nw5Ugh8vwzHMdPzx0XSoPx6cotx4MuHa8ojKAUzEtdSqb0PvOlwJDTNnF-ZePKD3s_Fv3RhbyGm2-c_1D86v1CvRilnU9CtXQkBi4hwDt/s1600/api.gif) no-repeat bottom;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 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+")", 5);}
}</script>
<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>
<div class="gbcontent">
<center>

<Letakan Script cbox kamu Disini>

<br />
<div style="text-align:center">
<a onclick="showHideGB()" class="tips-fade" title="klik untuk tutup">
<center><hr /><img src="http://i1042.photobucket.com/albums/b429/Farix_2010/CloseComment-1.png" /><hr /></center>
</a>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script></div>

7. Setelah langkah berikut simpan Gadgetnya, jangan lupa ganti kode Chat Box  dengan milik anda.

Nah selesai mudah bukan, sekian artikel tentang Cara Membuat ChatBox Tersembunyi Pada Blog versi David Wahyu selamat mencoba dan semoga bermanfaat.Terima kasih telah berkunjung kunjungi terus http://mr-kodok.blogspot.com. Komentar kritik dan saran anda adalah inspirasi saya silahkan pos di tempat yang telah tersedia

Baca juga artikel tentang :

1. Cara Membuat Widget Bloger Indonesia

2. Cara Memberi Modus Hemat Energi di Blog.html

3. 7 Fenomena Alam Teraneh Menakjubkan

Terima Kasih Anda Telah Membaca Artikel Tentang
Judul : Cara Membuat ChatBox Tersembunyi Pada Blog
Ditulis Oleh : Unknown
Berikanlah saran dan kritik atas artikel ini. Salam blogger, Terima kasih

Baca Juga Artikel Tentang :