Tutorial: Cara nak sembunyikan ShoutBox Mengkome~

بسم الله الرحمن الرحيم

Kali ni nak ajar korang camne nak sembunyikan 

Shout Box/Shout Mix korang yg boleh

kate beso gedabak tu...

Penat nengoknye kan~~

Ok... caranya camni...harap tak susah le yea...

1. dashboard > design > page element > add a gadget > HTML/javascript.
2. Copy & Paste kod bawah ni kat dalam box html/javascript tu...

<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://2.bp.blogspot.com/-hp5hb7Z7Gvk/TmzEhhJZRmI/AAAAAAAAGgo/vmECDANflYw/s320/shoutbox.png') no-repeat;

}

.gbcontent{

float:left;

border:2px solid #666666;

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

<!-- Begin ShoutMix - http://www.shoutmix.com -->

<iframe title="fana1790" src="http://www5.shoutmix.com/?fana1790" width="160" height="400" frameborder="0" scrolling="auto">

<a href="http://www5.shoutmix.com/?fana1790">View shoutbox</a>

</iframe>

<br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />

<!-- End ShoutMix -->




<div style="text-align:right"><a href="http://pencaripencintailahi.blogspot.com/2011/12/tutorial-cara-nak-sembunyikan-shoutbox.html" target="_blank"><small>tutorial here</small></a>
<a href="javascript:showHideGB()">

[close]

</div>

</div>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.right = (30-gb.offsetWidth).toString() + "px";

</script>

*bahagian MERAH tu adalah Kod utk Shout Box korang... 

kalo nak Shout Box korang kena tekan sini dulu dan daftar la eak...

3.   Then, Save pastu tengok le hasilnya...

Korang mesti nak tukar2 kan warna utk shoutbox tu..kalo aku pya jadi camni

kalo nak tukar len2 bleh amik URL pic2 kat bawah ni...

*amik URL tau...

*tukar kat coding ni yea...cam biase ctrl+F untuk senang nak cari code ni...

.gbtab{

height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('URL GAMBAR') no-repeat;
}

   

Rasenye dah setle kot..hehee...


mood: teruja sebab da bleh sembunyikan shoutbox sendiri...
heheheee

TAluvFA4eva