PhotobucketPhotobucketPhotobucket

Saturday, November 27, 2010

TuToRiaL TaB MeNu

semalam fy da post tutorial nak buat backgroundkan? then ada orang buat request dekat fy mintak ajarkan cara buat tab menu..sebenarnya, ni pon first time fy buat and alhamdulillah jadi..so sekarang ni, fy nak share plak cara fy buat tab menu..

1. mula2, kene design tab korang sendiri..kalau rajin nak search terpulanglah tapi fy buat sendiri je..untuk design tab ni, fy guna adobe photoshope, senang nak maen by layer..layer 1st, fy amik dari layout blog fy supaya nampak match..send layer amik je dari object and pilih warna y seswai..lastly, barula taip nama tab tersebut..

Remove Formatting from selection
size= width 120px, height 40px
width berubah mengikut panjang perkataan..=]

2. bila da siap, bolehla terus upload..dan menjadi kebiasaan, fy akan upload dekat photobucket.com. kalau nak guna y laen pon boleh contohnya, http://imageshack.us/. terpulangla, atas keselesaan masing2..da upload amik html code dia..


3. lepas 2 pergi Dashboard ->Design -> Add a Widget ->HTML/Javascript. paste code y da copy tadi..bila da siap paste, korang klik Rich Text. inilah rupanya..

sebelum klik

selepas klik

4. step terakhir adalah link kan setiap button dengan page y korang nak..misal kata korang nak buat satu tab tutorial. blog korang mesti ada widget label kan? korang klik je link turorial pada widget label 2, then korang copy url dia..contoh macam ni..

link y korg da copy 2, korg letak la kat button TUTORIAL. cara dia macam ni..highlight button tutorial, klik button link (tgk pada pic kat bawah) dan pastekan link td..lepas 2 save la..

da pun siap..maka korang pon adala tab menu buatan sendiri..kan kan? selamat mencuba..yeay!!


Di BeBeLKaN oLeH PaDa
Labels:

67 comments :

  1. nora amila ghazaliNovember 27, 2010 at 2:13 PM

    waaaa.... tq... dh lama cari tapi tak der sapan nak tolong.. tq3...

    ReplyDelete
  2. cik ETTYNovember 27, 2010 at 2:17 PM

    waaa fy thanx2 4 d tutor. ley try nnti :)

    ReplyDelete
  3. caliph shurikenNovember 27, 2010 at 2:32 PM

    nice & simple en3..
    thanks for sharing fy ^^

    ReplyDelete
  4. ahmad endoNovember 27, 2010 at 2:40 PM

    nanti leh cuba...hehehe

    ReplyDelete
  5. Nur Azila IsmailNovember 27, 2010 at 5:39 PM

    menarik2 :)

    ReplyDelete
  6. NasirNovember 27, 2010 at 6:09 PM

    bijak2..thanz yer tutorial nie~~~

    ReplyDelete
  7. AiMaNNovember 27, 2010 at 6:19 PM

    cantik.thanks 4 sharing..tapi atok ada cara lain jugak..nak taw?

    kt cini la..klik2..

    http://petuakitasemua.blogspot.com/2010/11/atok-dah-berjaya.html

    cara ni simple sikit...

    ReplyDelete
  8. UnknownNovember 27, 2010 at 6:25 PM

    hehe amboii mcm2 dah dia reti wat kan hehe :)

    ni fatin tag fy join contest ni

    jom join contest ni...
    ni link tuan blog :D
    fatin tag fy lam contest ni
    dan fatin sebagai referrals fy tau hehe

    ni link contest 2 :)
    http://www.kawaiigadget.com/2009/11/kawaii-gadgets-contest.html

    ReplyDelete
  9. AiMaNNovember 27, 2010 at 6:34 PM

    yup..itu yg basic..sbb tu atok cakap senang n simple..tp yg cucu ajar lg chantek..

    ReplyDelete
  10. IrnieNovember 27, 2010 at 6:44 PM

    ehhe thanks.. mmg cari info nih.. tq tq.. :D

    ReplyDelete
  11. ♥NuR SyAFiQah♥November 27, 2010 at 6:58 PM

    bape size setiap menu tab tu ek kalo nk edit nk photoshop??

    ReplyDelete
  12. UnknownNovember 27, 2010 at 7:15 PM

    nora amila ghazali: wcome..hehe

    ReplyDelete
  13. AiMaNNovember 27, 2010 at 7:15 PM

    cakap camne cu? x paham la..hohoho

    ReplyDelete
  14. UnknownNovember 27, 2010 at 7:16 PM

    cik ETTY: try jgn xtry ye..

    ReplyDelete
  15. UnknownNovember 27, 2010 at 7:16 PM

    caliph shuriken: my pleasure caliph..

    ReplyDelete
  16. UnknownNovember 27, 2010 at 7:17 PM

    ahmad endo: sila cuba ok..senang je..=]

    ReplyDelete
  17. UnknownNovember 27, 2010 at 7:17 PM

    Nur Azila Ismail: cuba la buat, mesti lg menarik..hehe

    ReplyDelete
  18. UnknownNovember 27, 2010 at 7:17 PM

    N@SIQUE: wcome..=]

    ReplyDelete
  19. UnknownNovember 27, 2010 at 7:18 PM

    AiMaN: thnx 4 da info atok..i lioke..

    ReplyDelete
  20. UnknownNovember 27, 2010 at 7:18 PM

    fatin hanani: thnx 4 da tag fatin..tp fy xjnji fy join tau..sorry..

    ReplyDelete
  21. UnknownNovember 27, 2010 at 7:19 PM

    AiMaN: atok ni,malu cu tau..haha

    ReplyDelete
  22. UnknownNovember 27, 2010 at 7:19 PM

    Irnie: wcome dear..=]

    ReplyDelete
  23. UnknownNovember 27, 2010 at 7:20 PM

    ♥NuR SyAFiQah♥: sory, lupa plak nk ckp, 120pxx40px..hehe

    ReplyDelete
  24. nurulbalqis ♥November 27, 2010 at 7:25 PM

    sis, menjadi laa! thnks !

    ReplyDelete
  25. QaqiquNovember 27, 2010 at 7:46 PM

    baru tadi cari kt en.google;)
    tutorial yg ni nmpk menarik + mudah! :)
    tq ya;)

    ReplyDelete
  26. LatifahNovember 27, 2010 at 9:27 PM

    owhhh akhirnya ada yang sudi kongsi tutorial ni... thanks ya... nnt nak cuba jugak lah...

    ~really appreciate it~

    *diriku ini malas nak google carik sendiri sebenarnya.... heheh*

    ReplyDelete
  27. PadinNovember 27, 2010 at 9:50 PM

    menarik juga ni hehee tapi aku lebih prefer gunakan pages yang di sediakna blogger je hee..

    apa pun nice info, mana tahu nak guna nanti, boleh rujuk entry fy..

    ReplyDelete
  28. UnknownNovember 27, 2010 at 10:00 PM

    AiMaN: xpula..xpam xpela..huhu

    ReplyDelete
  29. UnknownNovember 27, 2010 at 10:00 PM

    Panda-B !: i xtipu ok..wcome..hehe

    ReplyDelete
  30. UnknownNovember 27, 2010 at 10:01 PM

    QaQa: time kasih..hehe

    ReplyDelete
  31. UnknownNovember 27, 2010 at 10:02 PM

    Latifah: akhirnya, fy pon rjin nk wat tutorial..hehe

    ReplyDelete
  32. UnknownNovember 27, 2010 at 10:02 PM

    padin: hehe..anda di galakkan rujuk entry ni.hehe

    ReplyDelete
  33. UnknownNovember 27, 2010 at 10:04 PM

    kyoshi_sousuke: sila la mencuba..=]

    ReplyDelete
  34. mizayusofNovember 28, 2010 at 12:38 AM

    menarik. thanks fy :)
    thanks for sharing :)

    ReplyDelete
  35. QaqiquNovember 28, 2010 at 2:30 AM

    fy, tumpang tanye sini;)
    kalau kite nak link kan terus ke page mcmn pulak ye? mcm fi buat "banner" terus ke page banner..tak pyh create post mcm "tutorial":)
    mcmn plk ye?;)
    *sowi klu fy pening;)*

    tq fy:)

    ReplyDelete
  36. UnknownNovember 28, 2010 at 8:09 AM

    Miza Yusof: my plesaure dear..

    ReplyDelete
  37. UnknownNovember 28, 2010 at 8:10 AM

    QaQa: fy da reply dekat blog kamu..=]

    ReplyDelete
  38. redzuan ridzNovember 28, 2010 at 11:24 AM

    da lama cari tutorial ni, huhuhu, jumpa jgak :)thanx for the sharing

    ReplyDelete
  39. .::: Princess MOMOY :::.November 28, 2010 at 11:45 AM

    thx... abru tahu
    tp baut masa nih xde page lain lg
    just nak kayakan info

    ReplyDelete
  40. UnknownNovember 28, 2010 at 12:02 PM

    redzuan: my pleasure..=]

    ReplyDelete
  41. UnknownNovember 28, 2010 at 12:03 PM

    .::: Princess MOMOY :::. xde hal la..smpan je dulu pon ok..=]

    ReplyDelete
  42. WanieNovember 28, 2010 at 4:37 PM

    besttttt..:)

    ReplyDelete
  43. UnknownNovember 29, 2010 at 8:42 AM

    Firdani: sronok kalau org hepy dgn ape y kita ajar..hehe

    ReplyDelete
  44. ika wengwengDecember 7, 2010 at 10:04 AM

    Thanks you , ;D ;D

    ReplyDelete
  45. kasehDecember 9, 2010 at 2:20 AM

    fy...tlg sy lbh skit boleh x? hehehe....sy da wat sumer2 ni. n mmg jd. tp tang link 2 xm0 plak. da pening da cr ni. mana nak dpt 'widget label ' 2 ? sy da btl2 blur da ni. tlg eh. ^_~

    ReplyDelete
  46. kAseh Abdul AzizDecember 9, 2010 at 4:56 PM

    fy...yg 2 dah tahu da. keje keras mlm td. hehehe..tp s0klan sy sm mcm s0klan qaqa 2.

    "fy, tumpang tanye sini;)
    kalau kite nak link kan terus ke page mcmn pulak ye? mcm fi buat "banner" terus ke page banner..tak pyh create post mcm "tutorial":)
    mcmn plk ye?;)
    *sowi klu fy pening;)*

    hehehe...wat tut0rial yg ni eh. thanks. ^_~

    ReplyDelete
  47. UnknownDecember 9, 2010 at 7:46 PM

    @iqa

    welcome dear..=]

    ReplyDelete
  48. UnknownDecember 9, 2010 at 7:47 PM

    @kaseh

    fy da reply dekat page kamu..

    ReplyDelete
  49. UnknownDecember 9, 2010 at 7:48 PM

    @kAseh Mir'Ha

    da siap tutorial utk kamu.. =]

    ReplyDelete
  50. Kiera ShakieraDecember 10, 2010 at 11:45 PM

    bagusnye fy ni..so sweet...byk boleh belajar ni..tapi skg ni bz kit..perlukan masa yg sesuai utk belajar..tq.. =)

    p/s:nnti,dance mat tu dah sampai,kirah cntaxt fy ye..installer tu compatible dgn sume jenis processor.xp,vista n seven.. =)

    ReplyDelete
  51. Farah chomotDecember 11, 2010 at 7:20 PM

    akak , nk design tag menu tuu kt mane ?
    sy tk thu nk design kt mne?
    tlg relpy k blog sy ye akak
    tlg akak :(

    ReplyDelete
  52. NiEzA aNiEyZaDecember 16, 2010 at 12:31 PM

    mcm mane nk bg center ye...plez help me =(

    ReplyDelete
  53. UnknownDecember 16, 2010 at 1:10 PM

    @nIEza AniEyZa....

    letak ni starting coding

    <center>

    g.luck..

    ReplyDelete
  54. JZ Business WorldDecember 16, 2010 at 11:41 PM

    mmg dah lama cari tutorial ni.. thanks! tak sabar nak try.. hope jadi. tq :)

    ReplyDelete
  55. pokpiJanuary 2, 2011 at 6:36 PM

    akhirnyaaaaaa!!!!!!!!! akhirnya aku berjaya membuat tab menu..(belum buat tp dh tau nk buat. ekeke..). toce2...

    ReplyDelete
  56. BEN_W7January 25, 2011 at 8:15 PM

    ALAMAK....xphm la cik fy...
    erm,bleh tlong sy x???

    ReplyDelete
  57. Anak MunsyiJanuary 27, 2011 at 4:05 PM

    Fy , mcm mana plak nak listkan tutorial tuu banyak2 ? fyqa dah highlight banyak dekat situu tapi dy tetap naik satu ja ? bole komen kat sini tak ? http://fyqaanakmunsyi.blogspot.com/

    ReplyDelete
  58. Tabika Perpaduan Taman NilamJanuary 29, 2011 at 4:42 PM

    cmne nak bagi button 2 duduk centre???
    saya buat duduk tepi

    ReplyDelete
  59. LADY NEOJanuary 31, 2011 at 8:42 PM

    fy..x jadi la..sedih :(

    ReplyDelete
  60. wαnîêÿFebruary 13, 2011 at 12:34 PM

    boleh terangkan tk mcm mane nk design tab menu tu?

    ReplyDelete
  61. Dayah July 3, 2011 at 6:35 PM

    thanks a lot for your tutorial. haha. seronok bila jadi, baru reti nak link kat menu, thank you sgt kak.. nice to know you, i just google...cara-cara tab menu, and sgt membantu. tq :)

    ReplyDelete
  62. kingtakraw@gmail.comJuly 4, 2011 at 9:54 PM

    Good Work akak!!

    ReplyDelete
  63. Wanie SamaniAugust 3, 2011 at 2:35 PM

    terima kasih! sangat membantu :)

    ReplyDelete
  64. Miera mastrixiaJanuary 29, 2012 at 12:33 PM

    salam...cm ne nk dptkn link wadget label tu ea? yg u ckp kt step 4 tu?? x brape fhm la...

    ReplyDelete
  65. UnknownJanuary 29, 2012 at 4:18 PM

    @Miera MasTriXia salam..fy ada buat tutor pasal tu..awk bleh cek dekat sini..ikot je steps dia insyaallah jadi..if xpam bleh tnye balik :)

    http://www.cheqppjoy.com/2010/12/tutorial-untuk-buat-link-pada-tab-menu.html

    ReplyDelete
  66. Cikla ShahrilJanuary 11, 2014 at 6:35 PM

    yeayyy...boleh gak akhirnye wat link ni. 3 hari 3 mlm try buat x jadi2.. tq adik.. ^_^

    ReplyDelete
  67. BEN_W7June 28, 2015 at 1:31 AM

    lame xmasuk sini...masih knl dgn ben w7?

    ReplyDelete

DoNT 4Get To DrOp Me A cOmMent b4 u LeaVe..
tQ.. =)

Subscribe to: Post Comments ( Atom )