Shoutbox adalah suatu widget yang penting ada di blog kita,Dengan widget seperti ini membolehkan kita berinteraksi dengan pengunjung blog kita. Dengan wujudnya interaksi ini akan menjalinkan hubungan antara pemilik blog dan pengunjung blog dan akhirnya widget ini juga akan mendatangkan traffic untuk blog kita.
Mungkin anda ingin menjimatkan ruang semasa memasang Shoutbox pada blog.Tip ini akan membantu anda untuk menampilkan shoutbox di halaman tanpa memakan space/tempat, kerana widget ini disembunyikan di samping Body blog.
Mungkin anda ingin menjimatkan ruang semasa memasang Shoutbox pada blog.Tip ini akan membantu anda untuk menampilkan shoutbox di halaman tanpa memakan space/tempat, kerana widget ini disembunyikan di samping Body blog.
Ikuti langkah berikut
1.Klick pada Design dan Pilih Add Gadget
2.kemudian pilih html/javascript dan Copy dan Paste kod 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://i219.photobucket.com/albums/cc282/garam63/SHOUT.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 kod ShoutBox anda disini
<div style="text-align:right">
<a href="http://teknikbuatblog.blogspot.com/2010/04/shoutbox-adalah-suatu-widget-yang.html"><font size="1"">get this </font></a><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></div></div>
3.Tingginya boleh diubah dengan menukar nilai 50px, sesuaikan dengan kehendak anda, dan gantikan perkataan yang berwarna merah dengan script/kod shoutbox,bahagian teks hijau boleh ditukarkan dengan imej yg dikehendakki
4.kemudian klik save.
Post a Comment
62 Comments:
kok g bisa..??
subhanallah.. sangat mudah & kini blog saya bertambah kemas! Terima Kasih, my blogger friend Yahaya! :)
pernah guna...
tp setelah agak lama timbul isu xnmpk...
mksdnye certain web browser xjmpe...
kenapa ye??
@.:|kamaryeah|:.kod ni ada javascript,rasanya kat internet explorer kot ada problem,atau kod pada template yg membuatkannya tak muncul.saya tak berapa pasti.
nak tanya macam mana nak alter tulisan SHOUT tu. misalnya nak tukar tulisan SHOUT tersebut kepada gambar yang mempunyai resolusi 160 x 160 px. gambar telah sedia ada di photobucket.
tukar saja link gambar pada teks warna hijau kat atas
berjaya..alhamdulillah..thanks atas ilmu nie..
salam.. camner nk tukar shout tuh ke warna lain.. nk cari dmane ye warna yang lain dari kod yg dberikn tuh?
@kim_HasNuL
Log in ke shoutmix…ambil setting..
Style and color..ubah setting kat situ.Boleh juga ambil load from preset dan klik save setting
tq cantik
sy berjaya buat utk shouthide tuh but sy nak tau camner nak ubah nama shoutbox tuh kepada nama yg sy pilih sendiri...
nanti diterjah kembali blognya.
@biskutnak tukar gambar tepi shout cuma ganti pada kod hijau tu alamat imej yg nak diletak..
thank yer..thank sgt2..simlpe n mudah paham..
salam.nk tya neh..dh buat..tpi mcm mna nk tkr imej yg SHOUT tuh?mmg dh tkr..tpi ble preview hya sparuh je imej yg kluar
@Aina Roslitukar pada kod hhijau masuk url gambar kat situ..gambar separuh..tak pasti sebabnya..saya tgk kat blog cik tak ada pula..
ta jadi pun~~ ta boley na bukak
wah2 syoknya....dah bleh...terima kasih ye....
dh buat dh tima kasih for the info
nk tukar shoutbox kepada gambar cmner???
@IkHwAnI lUvmasuk url gambar pada tempat letak kod shoutbox
0oo,ok i'll try...uhuh.thnkz
xjd..erm xperlh..guna jerlh shoutbox tu pun..hehe
mcm mana nk cancel shoutbox ini dalam blog
cam ner nk cancel shoutbox kat blog???please help me...!!!
@Fiizya Auroraremove kod yang dimasukkan
Thank you :) .
halal yee
salam . sy nak tanya . kod yg kat atas tu mesti copy & paste semuanya ea ? termasuk 'letakkan kod shoutbox anda disini' ?
@fieyka syukrikena salin semua kod dan masukkan
thanx (:
MEkasih dik..Akak dah buat dan berjaya !!!! Suka sangat :)
nk tnyer,cne yg letak picture kt link hijau tu?cmne nk dptkn picture tu???
@yahaya
kat maner???
tak jupe pon..
@Fiizya Aurorakat sebelah tepi kanan
bro yahaya nak tnya, kalau
guna cbox jadi x widget shoutbox
ni tersembunyi. or kena guna
platform shoutmix je?
@redz
CBOX pun boleh juga cuma masukkan kod pada bahagian teks merah diatas
xjadi pun.......:(
adehh, mcm mana na tukar 'shoutbox' kepada gmbr lain huh ?
@natashaalesyaahmadnawawitukar url pada teks hijau diatas
nape siswi xjdk??
shoutbox xhide pom..=(
dia kuar bsr gedabak kt blog..
terima kasih FAR dah ambik kod ni...
it's work .. tengs for helping :)
ada x shoutbox yg bcorak???
mcm mane nk buat pix dkt s.box tu full eh after kite tuka??
camne nk tukar behavior n tempat shoutbox ni ek...???
asalnyer kn tersembunyi kt belah kanan n keluar dari kanan ke kiri...
nak tukar jd tersembunyi kt tempat widget n keluar kebawah...
@Dinie Asyrafcuba shoutbox melayang
mcm mane nak buat kod nie letak kat tajuk slide bar.. maksud sy jd kan slide bar 2 boleh buka/tutup
@Muhd Alish Syaufiq Zulkarnain
mungkin tutorial...ini boleh membantu....http://teknikbuatblog.blogspot.com/2010/09/cara-membuat-butang-buka-dan-tutup.html
KALO MAU DIPINDAHIN KESEBELAH KIRI BAGAIMANA?
macam mana nak buat ikon shoutbox tu?
nape sy nak tuka imej xley ek?? huhu
@CikEmoNiamungkin ada salah pada kod url gambar...
@yahaya
shout box tu dah ada..tp mn ruangan nak komen..xda pun..tlg tgkkan..http://nazirah-pieceofmind.blogspot.com
sesuai utk sy yg bru nk blajar buat blog.tQ (^ ^,)
thanks ! tp tak boleh ke tukar shoutbox tu kpd colour purple. sy buat tak buleh. hewhew
@fiona :
saya x pasti nak tukar warna yg mana satu...kalau yg saya beri ni warna biru saja..
yeahh!! jadila..heee..thanksss.. :)
tq....so much der
Terimakasih banyak atas semua widget nya gan........
Useful tuts and nice one from widget blogger.
Thanks and Salam
Amatullah @ Tips Trik Blogging
thank...cara yang mudah dan berkesan...thank g..
terima kasihh
mantap ilmunya