Fajar Herianto

Cara Membuat chatBox atau shoutmix Berada di samping Di Blogger



Cara Membuat chatBox atau shoutmix Berada di samping Di Blogger

Chatbox atau shoutmix adalah widget terpopuler bagi sebagian besar blogger. Tips dan triks blog yang akan kita bahas kali ini adalah bagaimana cara Membuat chatBox atau shoutmix Berada di samping blog kita.

Cara membuatnya sobat bisa mengikuti langkah-langkah sederhana berikut :

1. Sobat harus memiliki code chatbox atau shoumix terlebih dahulu, bacacara membuat chatbox disini.

2. Sobat login ke dashboard blogger.com --> Rancangan --> add gadget --> pilih yang 'HTML/JavaScript'
3. Copy Code berikut :

* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i683.photobucket.com/albums/vv193/vebyo/Guest3.gif') 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 SCRIPT CHATBOX SOBAT DISINI
 
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>

Keterangan :
Sobat ganti PASANG SCRIPT CHATBOX SOBAT DISINI dengan script chatbox sobat.
 
4. Save, lihat hasilnya.

Membuat chatBox atau shoutmix Berada di samping itu ternyata mudahkan? kita hanya perlu menambah code tertentu saja. Have fun ...

Posting Komentar

Fajar Herianto

{facebook#https://www.facebook.com/fajarcintalia} {twitter#https://twitter.com/HeriantoFajar} {google-plus#https://plus.google.com/u/0/118173459679605761698/posts} {youtube#https://www.youtube.com/user/aplikasiterunik} {instagram#https://www.instagram.com/aplikasiterunik/}

Formulir Kontak

Nama

Email *

Pesan *

Diberdayakan oleh Blogger.
Javascript DisablePlease Enable Javascript To See All Widget