Toturial #1--> ShoutBox

 Slm pde sume blogger ...
       Ok , ari ni Hana nk buat Toturial utkShoutbox...
       Rmai jgk yg tnye = " Cam ne nk buat Shoutbox ? " .... ok ..
       Hana akn tnjkkn t0p2 soalan yg d'tanye oleh 2 org bdk yg C0MEY =

From = Adek Afina

From= Adek Husnina

Okey !! mry kite mulekan toturial ni....

1.Dashboard > Design > Add Gadget > Html

2. Korg copy code kat bawah ni dulu....

_______________________________________________________________________

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

_________________________________________________________________________

Pastykn korg dh sign up Shoutmix tau .... ;)

3. Lepas tuh , dh copy , paste kat Html tuh ok?

4. Yang Warna MERAH tuh , korg g la cari pic mana2 yang ada tulis shoutbox k ?

5. Then , masukkan kat dlm kurungan tuh :) Nak cari kat Photobucket pon boleh jer ;)

6. Bg yang warna BIRU , korunk boleh tulis size tuh , mngikut kesesuaian ;)

7.Save . Beres :)

Kat Sini ! Hana ada bagi beberapa contoh image untuk Shoutbox ! Korg nak ? Ambik-Ambik ! jgn malu!
_________________________________________________________________________

http://i1181.photobucket.com/albums/x436/babybear520/lmh_130110_a-1-1.png

_________________________________________________________________________

                           http://th1002.photobucket.com/albums/af144/azmi88/th_small-shoutbox-icon.png

_________________________________________________________________________

   

   https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZruw05T7WdeNFZAUPi8X7RnluXsYOGvdqrGg-yW6rrZM_qnGGWC74sYCetT8RnohHV_dlhIPtjbuLlcToNc0rytFZQq3-cYkwyb1PPN4T0LMuo4wIYjOwPXx9Qmy90LttAh4Kr2bl3bE/s1600/Image+1.png

_________________________________________________________________________

               http://i389.photobucket.com/albums/oo336/iqa_angelz/SHOUTBOX.

______________________________________________________________________________________________