Friday, May 6, 2011

Tutorial : Menu bar paling senang abad ini



Hai korang korang sume. Tiba tiba macam nak buat tutorial plak. Ye baru first time neh nak wat tutorial. Kalo ikutkan aku mmg tak de la nak wat tuto tuto ni. sbb aku pon belajar dari Huda Luna. Then bila ada org request baru la tegerak hati nak buat.


Ari ni tutorial nak buat Menu bar paling senang kacang goreng. Tahu tak menu bar tu acane?






tu dia menu bar kat blog ni. Sebelum ni aku penah gak nak bwt menu bar yg cantik cantik siap edit ape sume kan, dah try pastu jadi cam tak cantik kecik beso kecik beso. 


Ok lets begin. Mula mula pegi dekat  Design >> Edit HTML >> Add a Gadget 
then paste code ni 



<p> <div style="background-color: #FF0000"> <a href="LETAK URL LINK KORANG KAT SINI" title='TITLE BILA DI HOVER'>TITLE DISPLAY</a> | <a href="LETAK URL LINK KORANG KAT SINI" title='TITLE BILA DI HOVER'>TITLE DISPLAY</a> | <a href="LETAK URL LINK KORANG KAT SINI" title='TITLE BILA DI HOVER'>TITLE DISPLAY</a> | <br /> </div> </p>

Ni cth background colour #FF0000 korang boleh tuka color background yg korang nak dkt siniDah siap copy paste letak dalam Add a Gadget >> drag masuk bawah header.  


Macam aku punye aku letak dkt atas Blog post. 

Ni bila drag atas blog post. Aku punye sbb siket je ltk ats blog post
Ni drag bawah header. sesuai utk korang ltk link banyak banyak.
Korang try la ikot suka korang nak drag ke mana. Then, PREVIEW DULU baru SAVE. 


<a href="LETAK URL LINK KORANG KAT SINI" title='TITLE BILA DI HOVER'>TITLE DISPLAY</a> korang boleh letak sebanyak yg mungkin. Nak separate antara link tu korang boleh guna | or - ape ape la yg korang rase cantik dan kemas dimata korang sume.  so akan jadi macam aku punye menu bar tu. Senang kan? Tayah edit gmbr la ape kejadah la. 


CREDIT kepada Huda Luna sbb ajar tutorial ini :)


Selamat mencuba!





34 comments:

  1. time kasih untuk tutorial ni :)

    ReplyDelete
  2. dr hari tu nk ty pasal ni tau..time ksh cik mira..blk nk try la...

    ReplyDelete
  3. rajin kau ek buat tutor...
    lau aku hareeeem lah.. nak update pon tade masa.. agagagaga

    ReplyDelete
  4. @storyfromme sama sama ! dah boleh bwt bg tawu tau :D

    ReplyDelete
  5. @merahitujambu hehehe nape tak tnye. kte tlg mane kte tawu :D

    ReplyDelete
  6. @♥ Cik Cha pestime kot aku buat tuto ni ekeekekke

    ReplyDelete
  7. wahh aish mmg tercari2 tutorial ni..aish suka menu bar mcm ni..sbb simple! nk buat lah!! hehe tq!

    ReplyDelete
  8. nice ! nak try jugakkk .
    thanks for the info~

    ReplyDelete
  9. @shaerin okey dear! Dah bole buat btau ye :)

    ReplyDelete
  10. kalau besarkan sikit tulisan dia, mesti lawa :)

    ReplyDelete
  11. @Amoi yup2 i dah try. i malas nak tuka haha

    ReplyDelete
  12. tutorial menarik tetapi sy pakai template.. semuanya sudah disediakan.. haha..

    Sila lawat: Kaoshi Troll

    ReplyDelete
  13. wahhh , very useful lah kak mira :) tenkiuu .

    ReplyDelete
  14. @Kaoshi ye ke ekkeke takpo nnt kalo pakai template bese try la gune :P

    ReplyDelete
  15. erm....
    cantek n mudah..
    leh cube..
    =D

    ReplyDelete
  16. salam hai mira...sy dh ikut cara tutorial menu bar awk..alhamdulillah dh sttle tp nk tnya ye, cmne nk edit tulisan menu bar 2 n nk besarkan tulisan 2 skali...tq ye..

    ReplyDelete
  17. saya baru buat blog..
    mcm mane ye nk wt link byk2 cam k.mira??

    ReplyDelete
  18. wallaweyhhhhhhhhhhh
    terhebattt
    terbaekkk
    tenkiuuuu
    tenkiuuu
    jadi dahh
    lawa...
    mai la jenguk blog sayeee

    ReplyDelete
  19. sya tak pndai pkai blog lgi . tpikn nak click dkt dashboard tu dkt mna eh ? sya search design and anything tak pernah jumpa pon . hrp boleh tlong ajarkn :)

    ReplyDelete
  20. This comment has been removed by the author.

    ReplyDelete
  21. as'salam kak, macam mana nak centerkan tulisan dia?? sya dh letak kod center depan dan belakang tpi bila save, tengok lagi masih jdi macam tu..

    ReplyDelete

This is best brooooooo!