Cara Sorok Shoutbox.
Saturday, December 04, 2010
Assalamualaikum..
ramai gak tanye camne nak sorokkan shoutbox ni..
senang je..same macam kite nak pasang widget lain kat blog..
1. copy code kat bawah ni ye..
<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/AVvXsEgXw3JHOP-aqyK5zRuevAOR4gj3-Bn8-2Lalmyhl53A1g4o8DlayPr8vysOYGDYZoyCPMj2S8h1w5H3M6kLLNHygfVIm8bBeV9wjxncLUND55J3TMOOOGo44ZHh83uHgSQa9rJU9_kG6kJO/s320/tabs.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">
MASUKKAN CODE SHOUTBOX KORANG 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 = (30-gb.offsetWidth).toString() + "px";
</script>
2. pegi ke design > page element > add a gadget > HTML/javaScript, then paste kan code tadi.
3. Tukarkan yang kaler biru tu dengan code shoutbox korang oke. 50px tu untuk kedudukan shoutbox, lagi tinggi nombor yang disetkan, makin ke bawah shoutbox korang tu nanti, oke?
4. save, save lagi kat bahagian atas, then view blog.
sudah siap..
selamat mencuba uols..
~wassalam~
pst : tutorial ni untuk yang tak tahu oke..pada yang tahu dan pakar..diam..diam..kredit untuk liyana.
20 Comments
thanks mia ..akhirnya boleh juger sembunyikkan chat box saya..
ReplyDeletethanks miaa..
ReplyDeletemmg tercari2 cmne nak wat ni
hehehe
@gaung
ReplyDeletewelkam..nnti try tau..ehehee
@Anisa Hang Tuah
ReplyDeletehehee..nis da buat nti, mia nk tgk..cpt3..ekhekhekee
thanks mia, hehe dah berjaye :D thank u soo mucho dear!
ReplyDelete@Cik Sehari Anti Kanta Lekap
ReplyDeletehehe..welkam..da buat ekk..oke jap nk tgk..ehehe
thanks mia.. (ntah nape thanks)
ReplyDelete@hamzah ian
ReplyDeletewelkam majah..grr..nk perli la tu..akehkehkee
tq3 da lama tora cri tutorial ni hehe ari ni jpe gak =)
ReplyDelete@MiSs TOrA
ReplyDeletehehehe..welkam dear..da buat nnti bgtau ek
kak mia thanks for info hehe :) btw nak bagi suggestion tuk kak mia. tue pon kalau kak mia suke la hehe. kite nak suggest yang comment kak mia guna pop-up punya. lagi mudah if lya and orang lain nak comment hehe :)
ReplyDeletemuah! <3
tq untuk ini budak kecik ;p
ReplyDeletetq untuk ini budak kecik ;p
ReplyDelete@alia shahira
ReplyDeleteehhehe..yeah dear..akk da buat pop up da..oke x?tq tau
@sharaBUNGA
ReplyDeletebudak kecik?khekehke..welkam dear
Waah.. akhir nya tahu jugak bagaimana cara nya.. thanks! ;)
ReplyDelete@Wan Fakhrul Rin
ReplyDeletewelkam yaa..ehhehe..nk tgk laa da berjaya buat ea
tq!! saya baru buat blog..sudi2 lah bagi semangat ea..hehe
ReplyDelete@Pa'An
ReplyDeletewelkam..huwa, happy blogging ya :)
Thanks ^_^ V!
ReplyDeleteSHARE LINK ANDA DI SINI
<a href="URL LINK BLOG U OLS"> NAMA BLOG U OLS</a>
thanks for dropping by...
^__^