Macam mana nak sorokkan ShoutBox tu?

by Sho Reen 9:51:00 PM 0 comments blogger cantikkan shoutbox shoutbox sorrokan shoutbox tabs pada shoutbox tutorial

Kelebihan menyorrokkan shoutbox, dapat mengurangkan berat page bile loading!
So :
Sorrokkan shoutbox macam mana?
Sini aku buat tutorial , meh ikut!

• Firstly, Dashboard --> Design --> Page Element --> Add Gadget . Pastu copy/paste kod 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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjffqnrxs3k09kF8FVoZYG26jaBDJysUQ-35QMhygd166NDaCTts7VIMbti9edmKv0ALHOS87rOh_oczodkkhnXrCky03HG5Avb7Ev_UODFrh8P4zGaK5G9l5gNJQIKk3tFPpw9FT-101Id/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 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>

• Ok! Lepas tu nampak tak *MASUKKAN CODE SHOUTBOX DI SINI* ?? Ha pastu masukkan la code shout box korang yang mmg dah ade tu~ !
• Pastu tekan Save

Ni contoh yg aku dah buat la :

Background Pink kat blkg ShoutBox aku ni x termasuk dlm HTML di atas ye!

OK! Selamat Mencuba !!!!