Holla holli chikibum chikebum guys. Harini nad nak kongsikan satu tutorial. Tutorial ni sesuai untuk blog yang ada shoutbox or shoutmix or chatbox. Tapi ni bukan nad punya tutorial. Ni Kak
Lyssa yang awesome gila punya tutorial. So let's Start.
Home >> Layout >> Add A Gadget >> HTML/Javascript
2) Korang copy code dekat bawah ni dulu tau
<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 KORUNK 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 / SHOUTBOX / CHATBOX KORANG DEKAT 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>
3)
Red text : Pilih je gambar mana mana korang suka. Copy image url then paste. Untuk dapatkan contoh gambar >>
Click Here<<
4)
Blue text : Korang boleh pilih ikut size yang korang nak
5)
Green text : masuk kan code shoutbox / shoutmix / chatbox korang dekat situ
7) Preview and save
