Thursday, June 07, 2012

tutorial : cara letak floating button !

Assalamualaikum yuOlszz !

apa khabar semua ! have a nice day ! okay , sebelum tue ,jom buat duit ! halakan cursor anda disini ! .
hari nie tiba-tiba nieya telah dirasuk angin kus-kus ape ntah . teringin pulak nak kongsi tutorial yang sudah diaplikasikan nieya dalam blog nie . k fine . nieya nie newbie jee okay . first time buat tutorial . kalau salah , mintak ampun & maaf okay ? ^^

tutorial letak floating button .



floating button tue macam yang kat atas nie . fungsinya lebih senang dan memudahkan pembaca blog korang connect dengan sosial network korang seperti facebook , twitter , feed(suapan) , youtube @ email . macam yang dekat sidebar nieya tue . ade floating button : facebook , fb fanpage , dengan feed . oleh sebab nieya takde twitter . nieya tukarkan dengan fb fanpage .  

caranya : 

1. login > dashboard > layout / design > add a gadget > html / javascript .

2. copy code di bawah nie dan pastekan dalam ruangan html/javascript tadi : 

<style type='text/css'>

a.linkopacity img {

filter:alpha(opacity=50);

-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}



a.linkopacity:hover img {

filter:alpha(opacity=100);

-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>



<div style='display:scroll; position:fixed; top:140px;left:-12px;'>



<a class='linkopacity' href='URL FACEBOOK ANDA' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/232.png" /></a><br />



<a class='linkopacity' href='URL TWITTER ANDA' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/432.png" /></a><br />



<a class='linkopacity' href='URL BLOG ANDA' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/blogger_64x64.png" /></a><br />


</div>



3 . okay . siap . 

nota kaki & tangan:

-untuk tulisan berwarna purple , korang ubah ikut suka hati / kesesuaian / selera korang . tak payah ubah pun tak pe . left boleh ditukar kepada right kalau nak button tue sebelah kanan . 

-untuk tulisan berwarna biru , letakkan url facebook , twitter , dan blog korang . contoh url untuk blog : http://craftynieya.blogspot.com . kalau url facebook dan twitter . tengok dekat url facebook @ twitter  masing-masing .

-untuk tulisan yang berwarna merah tue , masukkan url button yang diinginkan . kalau tak nak tukar pun boleh , jenis button sama macam yang dekat atas . sila rujuk google untuk mendapatkan button yang diingini .

-untuk tulisan berwarna hijau ( untuk korang yang nak tukar button lain seperti youtube , email )

4 . dah siap ? cuba , preview . kalau tak ada apa-apa error , boleh save dah . 

tambahan : 
~untuk korang yang tak ada twitter @ facebook @ salah satu , nak letak fb fanpage ke , youtube ke . korang boleh rujuk google , cari small button images yang korang nak . 

~bila dah dapat , copy image tue dan gantikan dengan tulisan berwarna biru . 

~untuk tulisan berwarna hijau , korang ubah . kalau korang letak button image youtube , ubah tulisan berwarna hijau kepada youtube . begitu juga kalau guna button lain . 

~jangan lupe letak url button yang korang dah ubah .

~klik preview , tiada error , klik save . that's all ! 

senang kan ? selamat mencuba !
kalau salah , mintak ampun & maaf . 

credit code to : jombinabelog.blogspot.com a.k.a blog comel ! thanks~ =)

bye~
Assalamualaikum . . 

CLICK DONATE N GET REWARDED ->


Thanks for reading. Do like and leave your comment. Really appreciate that :)

Comments
4 Comments

4 comments:

  1. Nice sharing.. thankz.. huhu..

    http://ruangannazira.blogspot.com/

    ReplyDelete
  2. hehe..welcomee..~thanks visit my blog~ =D

    ReplyDelete
  3. wah.nice tutorial..hehehe.. salam perkenalan daripada sy :)

    ReplyDelete
  4. hehe..thanks boni singgah sini follow n komen~~

    =)

    ReplyDelete

✿ Assalamualaikum, thanks comment here yo ! ✿

This is an Official Blog. Copyright© All Rights Reserved http://craftynieya.blogspot.com