Sembunyikan Shoutbox pada sisi kanan blog
Assalam , hari ni pulak nak ajar cara sembunyikan shoutbox kita pada sisi kanan blog . Mudah jeh , cara-caranya seperti di bawah :
1) Sign in akaun blogger
2) Dashboard > Design > Page Element > Add A Gadget > Html / Javascript
3) Copy paste kod di bawah pada ruang Html / Javascript tadi
2) Dashboard > Design > Page Element > Add A Gadget > Html / Javascript
3) Copy paste kod di bawah pada ruang Html / Javascript tadi
<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">
<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>
#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>
Catatan:
- Gantikan teks MASUKKAN KOD SHOUTBOX DI SINI dengan kod shoutbox korang.
- Url berwarna biru dalam kod di atas merupakan url shoutbox button. Korang boleh pilih button pelbagai warna di bawah. Just copy paste url yang disediakan dan gantikan pada url biru dalam kod di atas
http://img84.imageshack.us/img84/6496/hijau.png
http://img36.imageshack.us/img36/3569/orenx.png
http://img829.imageshack.us/img829/127/pinkcair.png
http://img710.imageshack.us/img710/7861/pinkkg.png
http://img97.imageshack.us/img97/6060/ungucair.png
- Url berwarna biru dalam kod di atas merupakan url shoutbox button. Korang boleh pilih button pelbagai warna di bawah. Just copy paste url yang disediakan dan gantikan pada url biru dalam kod di atas
http://img84.imageshack.us/img84/6496/hijau.png
http://img36.imageshack.us/img36/3569/orenx.png
http://img829.imageshack.us/img829/127/pinkcair.png
http://img710.imageshack.us/img710/7861/pinkkg.png
http://img97.imageshack.us/img97/6060/ungucair.png
4) Save dan lihat hasilnya.
Selamat Mencubaa ^^
No comments:
Post a Comment