Cara Sembunyikan Shoutbox Blog (Hidden Shoutbox)

hari nie kita buat tutorial lagi yer...Nurul nak tunjuk cara macam mana nak sembunyikan shoutbox blog. antara kelebihan kenapa shoutbox disembunyikan adalah untuk menampakkan page kita menjadi lebih kemas dan cantik.

korang tau tak apa tu hidden shoutbox?
kalau tak tau tengok kat bawah nie...

inilah contoh hidden shoutbox. selepas klik shoutbox baby camera tu, akan keluar macam nie....

Da tau kan apa tu hidden shoutbox...sekarang nie jom ikot tutorial Nurul....

Step 1 : Mula-mula Klik > Dashboard > Design > Page Elements > Add Gadget > Html/Javasript 

Step 2 : Lepas tu copy code kat bawah nie  :-

<style type="text/css">

#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:350px;
width:140px;
float:left;
cursor:pointer;
background:url('URL PIC YANG KORANG SUKA') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #00000;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 150-w) : moveGB(170-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">

MASUKKAN KOD SHOUTMIX KORUNK KAT SINI 

<div style="text-align:right">
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (140-gb.offsetWidth).toString() + "px";
</script>

       *warna merah : korang boleh tukar size mngikut kesesuaian ^_^

       *warna pink : url picture yang korang pilih ^_^

            

        
Step 3 : Akhir sekali paste kan code yang di copy tadi dalam Html/Javasript dan Save! Lepas tu boleh la lihat hasilnyer yea....

Kat bawah nie Nurul ada freebies beberapa picture untuk shoutbox. Kalau suka, ambil la... da ambil jangan lupa bagitau yer....^_^

http://i1105.photobucket.com/albums/h346/ayusleeping11/sbox/sbox4-1.png

http://i1105.photobucket.com/albums/h346/ayusleeping11/sbox/sbox1-1.png

http://i1105.photobucket.com/albums/h346/ayusleeping11/sbox/sbox2-1.png

http://i1105.photobucket.com/albums/h346/ayusleeping11/sbox/sbox2.png

http://i1105.photobucket.com/albums/h346/ayusleeping11/sbox/sbox4.gif

http://i1105.photobucket.com/albums/h346/ayusleeping11/sbox/sbox3-1.png

http://i1105.photobucket.com/albums/h346/ayusleeping11/sbox/sbox5.png

Selamat Mencuba!

---

A true muslimah : never forget that Islam, which encourages her to look attractive under the permitted limits, is also the religion that's warns her against extravagance ^_^

---