memasang shoutbox tersembunyi

shoutbox tersembunyi
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.

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.

Catat Ulasan

60 Comments:

heLL_Boy berkata...
terima kasih atas kunjungan

kok g bisa..??

positiveAlpha berkata...
terima kasih atas kunjungan

subhanallah.. sangat mudah & kini blog saya bertambah kemas! Terima Kasih, my blogger friend Yahaya! :)

.:|kamaryeah|:. berkata...
terima kasih atas kunjungan

pernah guna...
tp setelah agak lama timbul isu xnmpk...
mksdnye certain web browser xjmpe...
kenapa ye??

yahaya berkata...
terima kasih atas kunjungan

@.:|kamaryeah|:.kod ni ada javascript,rasanya kat internet explorer kot ada problem,atau kod pada template yg membuatkannya tak muncul.saya tak berapa pasti.

geekz36 berkata...
terima kasih atas kunjungan

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.

yahaya berkata...
terima kasih atas kunjungan

tukar saja link gambar pada teks warna hijau kat atas

cikmimmie berkata...
terima kasih atas kunjungan

berjaya..alhamdulillah..thanks atas ilmu nie..

kim_HasNuL berkata...
terima kasih atas kunjungan

salam.. camner nk tukar shout tuh ke warna lain.. nk cari dmane ye warna yang lain dari kod yg dberikn tuh?

yahaya berkata...
terima kasih atas kunjungan

@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

fiqsan berkata...
terima kasih atas kunjungan

tq cantik

biskut berkata...
terima kasih atas kunjungan

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.

yahaya berkata...
terima kasih atas kunjungan

@biskutnak tukar gambar tepi shout cuma ganti pada kod hijau tu alamat imej yg nak diletak..

farah jaamat berkata...
terima kasih atas kunjungan

thank yer..thank sgt2..simlpe n mudah paham..

Aina Rosli berkata...
terima kasih atas kunjungan

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

yahaya berkata...
terima kasih atas kunjungan

@Aina Roslitukar pada kod hhijau masuk url gambar kat situ..gambar separuh..tak pasti sebabnya..saya tgk kat blog cik tak ada pula..

dhilla nazli berkata...
terima kasih atas kunjungan

ta jadi pun~~ ta boley na bukak

LadyzuL ⎝⏠⏝⏠⎠™ berkata...
terima kasih atas kunjungan

wah2 syoknya....dah bleh...terima kasih ye....

Apple Sweet berkata...
terima kasih atas kunjungan

dh buat dh tima kasih for the info

IkHwAnI lUv berkata...
terima kasih atas kunjungan

nk tukar shoutbox kepada gambar cmner???

yahaya berkata...
terima kasih atas kunjungan

@IkHwAnI lUvmasuk url gambar pada tempat letak kod shoutbox

IkHwAnI lUv berkata...
terima kasih atas kunjungan

0oo,ok i'll try...uhuh.thnkz

IkHwAnI lUv berkata...
terima kasih atas kunjungan

xjd..erm xperlh..guna jerlh shoutbox tu pun..hehe

Fiizya Aurora berkata...
terima kasih atas kunjungan

mcm mana nk cancel shoutbox ini dalam blog

Fiizya Aurora berkata...
terima kasih atas kunjungan

cam ner nk cancel shoutbox kat blog???please help me...!!!

yahaya berkata...
terima kasih atas kunjungan

@Fiizya Auroraremove kod yang dimasukkan

fatihahilmi :) berkata...
terima kasih atas kunjungan

Thank you :) .
halal yee

fieyka syukri berkata...
terima kasih atas kunjungan

salam . sy nak tanya . kod yg kat atas tu mesti copy & paste semuanya ea ? termasuk 'letakkan kod shoutbox anda disini' ?

yahaya berkata...
terima kasih atas kunjungan

@fieyka syukrikena salin semua kod dan masukkan

Fika Syukri berkata...
terima kasih atas kunjungan

thanx (:

AdiaLuze berkata...
terima kasih atas kunjungan

MEkasih dik..Akak dah buat dan berjaya !!!! Suka sangat :)

FaLieNA si giLER koREAN.. berkata...
terima kasih atas kunjungan

nk tnyer,cne yg letak picture kt link hijau tu?cmne nk dptkn picture tu???

Fiizya Aurora berkata...
terima kasih atas kunjungan

@yahaya
kat maner???
tak jupe pon..

yahaya berkata...
terima kasih atas kunjungan

@Fiizya Aurorakat sebelah tepi kanan

redz berkata...
terima kasih atas kunjungan

bro yahaya nak tnya, kalau
guna cbox jadi x widget shoutbox
ni tersembunyi. or kena guna
platform shoutmix je?

yahaya berkata...
terima kasih atas kunjungan

@redz
CBOX pun boleh juga cuma masukkan kod pada bahagian teks merah diatas

Cik Aishah berkata...
terima kasih atas kunjungan

xjadi pun.......:(

natashaalesyaahmadnawawi berkata...
terima kasih atas kunjungan

adehh, mcm mana na tukar 'shoutbox' kepada gmbr lain huh ?

yahaya berkata...
terima kasih atas kunjungan

@natashaalesyaahmadnawawitukar url pada teks hijau diatas

cinta siswi berkata...
terima kasih atas kunjungan

nape siswi xjdk??
shoutbox xhide pom..=(
dia kuar bsr gedabak kt blog..

Fitrah Ayu Resources berkata...
terima kasih atas kunjungan

terima kasih FAR dah ambik kod ni...

060709 ^^ berkata...
terima kasih atas kunjungan

it's work .. tengs for helping :)

Aishiteru ZhaFiza berkata...
terima kasih atas kunjungan

ada x shoutbox yg bcorak???

Cik Siti Rahmah Bahrom berkata...
terima kasih atas kunjungan

mcm mane nk buat pix dkt s.box tu full eh after kite tuka??

Dinie Asyraf berkata...
terima kasih atas kunjungan

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...

yahaya berkata...
terima kasih atas kunjungan

@Dinie Asyrafcuba shoutbox melayang

Muhd Alish Syaufiq Zulkarnain berkata...
terima kasih atas kunjungan

mcm mane nak buat kod nie letak kat tajuk slide bar.. maksud sy jd kan slide bar 2 boleh buka/tutup

yahaya berkata...
terima kasih atas kunjungan

@Muhd Alish Syaufiq Zulkarnain
mungkin tutorial...ini boleh membantu....http://teknikbuatblog.blogspot.com/2010/09/cara-membuat-butang-buka-dan-tutup.html

ayo bermimpi berkata...
terima kasih atas kunjungan

KALO MAU DIPINDAHIN KESEBELAH KIRI BAGAIMANA?

Syaza Afiqah berkata...
terima kasih atas kunjungan

macam mana nak buat ikon shoutbox tu?

CikEmoNia berkata...
terima kasih atas kunjungan

nape sy nak tuka imej xley ek?? huhu

yahaya berkata...
terima kasih atas kunjungan

@CikEmoNiamungkin ada salah pada kod url gambar...

Nazirah berkata...
terima kasih atas kunjungan

@yahaya

shout box tu dah ada..tp mn ruangan nak komen..xda pun..tlg tgkkan..http://nazirah-pieceofmind.blogspot.com

misz maria berkata...
terima kasih atas kunjungan

sesuai utk sy yg bru nk blajar buat blog.tQ (^ ^,)

fiona : berkata...
terima kasih atas kunjungan

thanks ! tp tak boleh ke tukar shoutbox tu kpd colour purple. sy buat tak buleh. hewhew

yahaya berkata...
terima kasih atas kunjungan

@fiona :
saya x pasti nak tukar warna yg mana satu...kalau yg saya beri ni warna biru saja..

Cik Tetra berkata...
terima kasih atas kunjungan

yeahh!! jadila..heee..thanksss.. :)

Hawa berkata...
terima kasih atas kunjungan

tq....so much der

Fajar Muhammad R berkata...
terima kasih atas kunjungan

Terimakasih banyak atas semua widget nya gan........

Amatullah berkata...
terima kasih atas kunjungan

Useful tuts and nice one from widget blogger.

Thanks and Salam
Amatullah @ Tips Trik Blogging

ZulQhairulNizam Mohammed berkata...
terima kasih atas kunjungan

thank...cara yang mudah dan berkesan...thank g..