Friday, 8 July 2011

Tutorial Hidden Shoutbox beserta Follower Box

Hallo..hai semua. Kali ini Idayu nak buat tuto pasal Tutorial Hidden Shoutbox beserta Follower Box.
Mula-mula aku try amik tuto daripada seseorang tapi buat tak jadi-jadi. So aku try buat experiment dan temui caranya by myself. Hohoho.

Caranya mudah saja. Nak kata berat tu tak de lah memberatkan blog sangat kot. Insyaalah la.

Dashboard = Design = Add Gadget = Pilih html/javasrcript
Copy coding dekat bawah ni dan paste kan di ruangan yang disediakan tu.


<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:400px;
width:150px;
float:left;
cursor:pointer;
background:url('gambar yang korang nak') 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, 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 FOLLOWER BOX ANDA DISINI
MASUKKAN KOD SHOUTBOX ANDA DISINI
<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 hijau tu korang boleh letak ikut korang la.
Yang warna merah dan purple tu boleh adjust tapi aku dah setkan. Baik jangan kacau.
Yang  kod shoutbox dan follower box tu korang isi lah ye. Jangan terbalik tau.

SAVE.. kalau jadi bagi tau. Kalau tak jadi pon bagi tau ye.

Kalau nak amik kod follower tu korang kena pergi dekat MY ACCOUNT.
Dan tekan GOOGLE FRIEND CONNECT.
Dan tekan ADD THE MEMBER GADGET....

dari situ korang akan dapat kod follower tu.

Oke lah. Nak buat homework pulak  <3
Kalau tak jadik..mintak mohon bagi tau ye  :)
Thanks For Reading

No comments: