cara buat shoutbox tersembunyi
Asalamulaikum dan Selamat Malam semua, Sebelum Melelapkan Mata yang tak Mengantuk lagi nih..huhuh ape2 tah ayat..huhuh.. Apiez nk kongsi ng korang tutorial macm mana nk buat Shoutbox yang tersembunyi, tutorial ni memg banyak orang buat tp Apiez buat benda ni hanya nk simpan dalam blog Apiez je, kot berguna untuk hari yang mendatang..huhuhu dan klu org lain nk tengok pn boleh kan, tak salah berkongsikan heheh...
Cara- Caranya :
1. Login pada blogger dasbor anda dan klik layout
2. Klik Page Elemen dan Klik add Gadget
3. Klik HTML/Java script Copy dan pastekan kode di bawah ini :
<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://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
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">
< Letakkan disini kode Shoutbox Anda>
<div style="text-align:right">
<a href="http://mofizputra.blogspot.com/search/label/Tutorial">
[Toturial blog]
</a>|<a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div>
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
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">
< Letakkan disini kode Shoutbox Anda>
<div style="text-align:right">
<a href="http://mofizputra.blogspot.com/search/label/Tutorial">
[Toturial blog]
</a>|<a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div>
Lihat gambar dibawah :
6. Apabila dah jumpe perkataan < letakkan disini kode shoutbox Anda >, seperti gambar diatas, langkah seterusnya gantikan perktaan tersebut dengan kode html shoutbox anda yang lama, lihat contoh gambar dibawah ;
salam... wahhhhhhhhh nanti bolehlah tunjuk umie cara nak buatnya ya... kalau baca arahan ni slowlah sikit... ;)
ReplyDeleteemmmm..xpe2. sy xde plak shoutbox. hehe ;D
ReplyDeleteto umie : heheh.. blh je umie senang je nk wt benda nih heheh..
ReplyDeleteNur su'aidah bachok : letak la shoutbox, t blh chat & tingalkan pesanan lm tuh..
:j:
Wasalam apiez.
ReplyDeletePcik tak berapa faham ya..kod html tu padam semua dulu baru copy past yang apiez letak di ulasan ka? atau paste di tempat "gantikan" tu..di kod html.
Minta bagiau lagi sekali ya.
maaf atas kekeliruan tu yea pak cik, Apiez dh updet dlm bentuk bergambar.. maaf atas tertinggal satu langkah, yg menyebabkan kekeliruan..
ReplyDeletedah buat dahhhh~!! hehe ;D
ReplyDeleteto suhaida : ah'a dh tengok dah td..heheh
ReplyDeletenape semalam tak jumpa blog ni ek..
ReplyDeletesemalam pandai2 sndiri je carik kt google..
naseb jmpa n dh siap pon hidden shoutbox kita..
tapi tak kesah la..
nak komen jugakz..
hehheh..
yeke.. heheh.. em sb ramai kot yng dah wt toturial nih..heheh sb tu tak jumpe.. heheh.. thks komen
ReplyDelete:a:
cool~
ReplyDeletesalam...
ReplyDeletearitu ade ke blog sape ntah... puas la meraban cari die punye shoutbox.... pastu perasan ade bende kat tepi profile tu...bile klik kuar la menatang tu... canggih da skang kan...hehehe...
to Putra Cinta : hahahahah... ah'a klu klik baru kluar menatang tu..hahahah.. emm biasalah sentiasa berubah2.. inovasi namanye tuh..huhuhuh..
ReplyDelete