Tutorial : Sembunyikan Shoutbox Pada Sisi Kanan Blog

Hmm.. Korang tak rasa macam penuh ke sidebar korang?

Ada macam-macam. FB badge, Twitter, Shoutbox, Follower, dan banyak lagi la..

So, aku nak buat tutorial la supaya sidebar korang berkurang satu. haha

Lagipun, korang tak payah lagi nak scroll down untuk baca komen yang ditinggalkan. Iya tak? :)

This post credit for this owner.

Korang pun dah baca kan tajuk post tu..

So, apalagi. JOM !

1. Dashboard > Layout > Add Gadget > HTML/JavaSript

2. Korang copy paste code kat bawah ni.

___________________________________________________________

<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('http://img560.imageshack.us/img560/7910/tkuningo.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 KOD SHOUTBOX ANDA DI 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>

________________________________________________________________

* Warna merah tu korang tukar shoutbox button korang. Korang boleh tukar macam-macam warna. Korang boleh pilih url kat bawah ni. Just copy paste url tu kat warna merah. Dah siap.

* Yang warna biru pula, korang kena masukkan korang punya kod shoutbox. Korang tau kan nak ambil mana? :)

3. Save and DONE.

Kan comel tu. haha

Gud luck guys !

http://img846.imageshack.us/img846/6586/tnavy.png

http://img560.imageshack.us/img560/7910/tkuningo.png

http://img829.imageshack.us/img829/127/pinkcair.png

http://img36.imageshack.us/img36/3569/orenx.png

http://img84.imageshack.us/img84/6496/hijau.png

http://img97.imageshack.us/img97/6060/ungucair.png