Thursday, December 31, 2009

.tutorial #23 - tab menu

.

.salam all~

.dah ramai sangat orang request tutorial ni tapi i asyik hold jer .so, hari ni, i nak ajar macamana nak buat tab menu versi cik intan .kah kah~ .i main hentam jer sebenarnya, tiba-tiba jadik .so, tahniah untuk diri sendiri ;)

1) .mula-mula korang create button tab menu tu dulu .i create guna picnik jerr .sebab malas nak pakai photoshop atau photoscape .korang buat lah ikut kreativiti korang .nak letak muka sendiri ker, kartun or plain jer pun boleh

.contoh.

2) .ni contoh button i .size dia 100 x 40 pixel .then lepas settle korang create tuh, upload dalam photobucket .siapa-siapa tak ada account photobucket, kena register dulu lah (Nak upload dalam blogger pun boleh, upload dalam entry, tapi jangan publish entry tuh. Lepas upload, copy link image then delete lah entry tuh.)


3) .lepas tu, copy HTML code yang photobucket sediakan

4) .bukak dashboard-layout-page element, then add a gadjet -HTML/Javascript

5) .then paste code yang photobucket sediakan tu dekat situ .lepas tuh, klik each image dan korang boleh link kan dia ke mana-mana page website yang korang nak .lepas tu save

6) .drag kan gadjet tu ke bawah header korang .then save lagi .lepas tu, siap! .senang kan kan? ;)


.so, selamat mencuba! :)

90 comments

hisham said...

salam...ade x skill bg blog wangi je bau..ade x..?...hehe
~i wish moge u epi slalu n dipermudahkan sgale urusan oleh Allah..aminn

.rENEx. said...

haah la sis..
bila sis da tnjuk ni bawu taw..
hehe..simple je nk wat..

tenkiu2 bgtaw..
syg sis lebih..
haha..
cntest lambat ag kan tamat..?

=]

mIsTa aLeH said...

wah best² mau try wat hehehe..
da lame mau wat =)

faye said...

Sis i'm made it....huhuhu...tq sis...thanks a lot...lama dah nantikan tutorial nie....saya dah siapkan...sila2 lar singgah ...n comment yea sis....huhu...thanks sis

nurhuda abdulrahman said...

isyh sis nih..
pakar nyer..
ape kte sis amek course yg relate ngan computer..
mesti dekan every sem...
xpon sis wat biz psl comp..
mesti jd jutawan r pasni..
hehe

♥ luna ♥ said...

menariknye....nnti nk cube la..

AM SYA said...

intan mmg style la~

cekap betol ngn bende2 alah ni..

intan pnyer blog archive xde??

i mmg rajen bc2 n3 yg lpas2..

yg bln2 lpas~~huhu ;)

sharamli said...

kal0 0rg wat nnt mesti xjdik...

LuVidA^^ said...

bgs la...x terpikir lak ley gune cara ni.
=D

intanurulfateha (◡‿◡✿) said...

.hehehe senang kan? ;)

yaya said...

kak intan..ite bru nk wt ni.thks aw ajr kt tutorial ni..kte nk wt side tok yg nk kne antr ue.so cm x kco blog yg sblm ni..kn?tol x?hee..neway..u rock kak!!!super duper bek oww...

intanurulfateha (◡‿◡✿) said...

~yaya

.hehehe tenks sayang :-*

Rafieq Roslan said...

Kak Intan!!!!!!!!!!!!
Teacher Intan!!!!!
Help Me!!!!!!!!!

Kak.. tolong gi kat

www.apit555.blogspot.com

kenapa saya punya TAB tak leyh nak drag- kan kat bawah..

*******************************

Ehh.. dah bleyh laa kak...

soalan lain laa..

Camner nak wat font macam (◡‿◡✿) ataupun yg rama2 tuu?? akak dapat dari mana??

Rafieq Roslan said...

kak.. camner nak wat comment notification??


bila orang komen kita bleyh tahu....

intanurulfateha (◡‿◡✿) said...

@Rafieq Roslan

.bole drag
.buat slow3 k

intanurulfateha (◡‿◡✿) said...

@Rafieq Roslan

.check kat comment setting ;)

t e m b u m e said...

salam akak~
sy ney br berjinak dgn blog..
so,still blur~
hehe..
neway,nk tnye..
kan da wat tab menu..
then cmne nk link?
mksdnye,tekan je bkk page lain..
thnkx~
:)

intanurulfateha (◡‿◡✿) said...

@t e m b u m e

.ohh
.dah siap tu, highlight gmbr atau word, then tkn hyperlink
.masukkan URL page yg u nk link kan tuu ;)

FiqaSaleh said...

yg ni i tak pham nak wat camaner.. dh berjya semua dha..part nak link kan tu yg tak dpt.. camner ek?

intanurulfateha (◡‿◡✿) said...

@FiqaSaleh

.u klik gmbr tuh, then klik hyperlink
.nti masukkan lah url page mne yg u nak link kan

llizam said...

yippie!!! akak berjaya buat!

Tq adikku cayang ... ehehehe

come visit my blog, ad entry TQ untuk adik:

http://llizam85.blogspot.com/

wan said...

huh..
x bleh la..
die x kuar gbr..
cm ne ni?

wan said...

come again..
heheh..
sya bru blogging ni..
jgn mrah yek tnye bnyak2..
sy dh dpt gbr tu tapi x boleh nk click kan..
bleh pun right click je..
tpi right click tu x de hyperlink.
cm ne yek??
tolong!!

intanurulfateha (◡‿◡✿) said...

@llizam

.ok kak ;)

intanurulfateha (◡‿◡✿) said...

@wan

.msti kuar punye!

intanurulfateha (◡‿◡✿) said...

@wan

.gune mozilla
.klu gune google crome mmg x leh klik

♥ifa tasya♥ said...

sis, ifa letak tutorial nie kat blog ifa...

nanti sis tgok taw...

http://ifatasya.blogspot.com/2010/07/tutorial-tab-menu-comel.html






jom jejak ke blog ifa
ifatasya.blogspot iS aBoUt a tEenAgE giRl wiTh hEr hUbBy

intanurulfateha said...

@♥ifa tasya♥

oke =)

huda rahman said...

yang neh konpem try dulu sebelum start new sem..eh sis dah start kita belom. HAHA

huda rahman said...

yeah.ini nak try jugak..

*hoii banyaknyer huda nak try tapi tak buat2..lagi nak start sem neh lagi tergendala la*

otoks said...

nice..tenkiu..nk try~ ^_~

ALFALORA MOHD MUSTAFA said...

hai..sy dah buat dah design tu..but then mcmne nk link kan design tu ya..i mean..klo click tutorial..kite akan g kt site tutorial..ni kalau sy click design tu..die g kt phtobucket nye website..

testblog said...

camne nak kasi dye jgn gerak pegy tab laen ble tekan ek ?
i mean , macam , ala .
macam . kalau kite tekan , dye bukak tab laen kann ? tapy macam mane nak kasi dye kekal kat tab tu jugakk if tekan ek ? help3 .

Dudu said...

i dah try wat..
menjadi..hikhik tqvm...
=)

Ila Nabilah said...

eyh, teacher intan, cam mn ek, kite nk upload gmbr dlm photobucket tu pas2 kite nk URL die?..blh ajr x?

intanurulfateha said...

@Ila Nabilah

pahamkan betul3 k pe yg i ajar tu

ieyza afieyna said...

akk,,nk tnye nie..cmne kn da buat tab tue..pastu org klik dlm tue ade bnyak bnde agy kne klik.. contoh nye: sye klik akk nye toturial,,pastu dlm tu kn bnyak agy kne klik..mcm mane nk wt tue??

xaty said...

thanks intan..jap2 nak tanya. kalau ada gap mcm mana eh? try intan tgk blog ni

http://miss-ok.blogspot.com/

Tab menu tu kan xrapat dgn body(?). nak adjust mcm mana eh?

tehaa hairul said...

hi kak :)
err..I tafaam lah yg 'clik each image ny'
how to do that? hmm :(

intanurulfateha said...

@tehaa hairul

klik lah gmbar tu, then u klik simbol hyperlink utk link kan gmbr tu ke page yg u nak

tehaa hairul said...

I da copy code dari photobucket then masuk kan dlm blog , tapi ta keluar pic pun? huh -.-'
*susah laa :)

tehaa hairul said...

kak , yg kat photobucket 2 kn?
na copy code yg mane? code image or html?

intanurulfateha said...

@tehaa hairul

kn dah ckp amek HTML code dkt tutorial tu
phmkan lah betul3 =.="

tehaa hairul said...

err..da buat.
da link da pun.
tapi bile tekan kt pic 2 , keluar kt photobucket pulak. hmm :(

intanurulfateha said...

@tehaa hairul

klu still photobucket, mknenye u x link lagik
select 1 tab, then insert ltk link

tehaa hairul said...

err..select 1 tab?
tafaam.
*sorry. I slow :)

intanurulfateha said...

@tehaa hairul

tab = image yg u create gune photobucket tu lah syg oii
kn u tgh buat tab menu =.=

tehaa hairul said...

seriously i dont understand it .

intanurulfateha said...

@tehaa hairul

ermm x dpt tlg lah cmtu
sori T__T

tehaa hairul said...

i just tafaam cmne na buat 'link' 2 je. hmm :c

intanurulfateha said...

@tehaa hairul

hmm u link la image tu mcm biase
mcm u link sape3 dlm entry tuu
i pun tatau nk xplain since i rse tutorial i tu dah simple habis dah ayat die

nurulfatin said...

macam mna nak guna?

didie dolly said...

akak camne yg new tab tu

puteri.diyana said...

thx 4 ur tutorial..
i'd search this tutorial 4 a long tyme..
now..i found it.!!really appreciate it/..huhu.. =) thx u

teha said...

sis sy dh link mcm wt kt entry tu tp bila klik ttp kuar photobucket jgk.nape ek?

shira err said...

law dah dapatkn link untuk pic cmne nk bgy dy contoh : biler click tutorials kuar tutorials smua tu . cmne nk link kn ek ?? tk reti lahh kak . boleh ajar tk ? hee :)

misz FaTiN said...

tq 4 dis tutorial sis,,
fatin da buat n jadi.. suke2..^_^

[the]Real Adlynn. said...

ouhhh,, daa jadi lorhhh..
tengssssssssssssssssssssssssss...

Nur Hanis said...

kak intan , macam mane nk gune mende alah nih ?
pastu , bile tekan yg home sume2 tuh , die keluar photobucket . kenape ekk ?
help mee !!!

Nur Hanis said...

kak intan , i dh link mcm wt kt entry tu tp bila klik ttp kuar photobucket jgk.nape ek? help me !

noorfashadirah(◡‿◡✿) said...

salam akak ! nak tnyer kit . dh uad dh sume tuhh . tapy , y hyperlink tuhh . . adek cary x jumper laaa . . kat ner ea ?

Yoona_Fudhla said...

*blog walking

-kak,tentang size tu,(picnik kan)kenapa x leh tukar?

intanurulfateha said...

@Yoona_Fudhla

bole. resize je la

Yoona_Fudhla said...

hrm..Mmmg saya resize,tapi lepas saya resize contoh width 100,nanti height dia pun terus active tukar 100..Macam mana ya?

Siti Safiyyah said...

yeayy! dah jadik! tenkiu sis. walaupun agak susah mule2..hehe

Siti Safiyyah said...

kak intan..saya buat tutorial pasal ni dan saya dah backlink ke entry ni..takpe kan sis? :)

http://lurvemyblog.blogspot.com/2011/01/tutorial-nk-design-menu-bar.html

ATIE said...

salam, kak nak tanya lah macam mana nak wat tajuk blog kita cantik? pas2 ada tulisan cantik macam akak 2...cute sgt...harap boleh tolong ajarkan yer?

al_farafishah said...

salam n hai dik intan... tutorial2 awk best lah.. mudah jer nak paham.. sy link kan bhgn tutorial di blog yang cute ni kat blog sy.. x per kan..? actually lama dah memantau blog ni.. best2...keep on blogging yer.. ^_^

♥ jiajasmi ♥ said...

sis , xjd pon . ;(

♡ Є˩ƳΔИΔ вт ΔѦƖИƲƉƉƖИ ♡ said...

cm ne nak bagy dy link an ?!
sory la , ta pandai sgat bb ny !

yaya here ;) said...

tak faham -.-
siap sampai copy code jah . lepas tu terus blurrrrrrrr :3 huwaaaaa . tolong T^T

Nasuha said...

Akak ! kalau dah drag sume tu kan..nak tulis entry kat mane ?!

Mahirah said...

salam! mcm ner nk msukkan entry dlm tuh?

Mahirah said...

and lg stu, yg tutorial tu mcm ner kte da ltk da link die tpi nk jd kan die ade tjuk jer ble kluar and ble tkn tjuk tu bru kluar posts de yg penuh... sye bwat tkn tutorial die terus kluar ngn post2 die skali...

arezura said...

SALAM INTAN..I NK TANYE NIE..I DH JD WT SEMUA2 TU KN..TP SATU JE X JD2..CM NE NK LTK ENTRY KT TAP2 MENU TU..BLEY X AJAR KN...CTH..KLU TUTORIAL TU ANTRY TUTORIL TU KT TAB TUTORIAL..CM NE EK..PLSSSS

princess_yuki17 said...

Akak bile time paste HTML code tuu.. die x kuar image n even if I highlight code tu pastu nk linkkn x blh

Jue-y Manan's said...

tak paham la, dah masuk picnik tu then buat apa? upload photo ke? --' please sys,

Dhaiyah Roslan said...

kenapa tak jadik ek???!!
dah banyak kali try dh

Dhaiyah Roslan said...

tak boleh la
tak reti nak buat

AyuCandy said...

Antara banyak2 tutorial yang saya cari, ni lah yang paling senang. Thank you so much.

Aishah Munirah binti Musa said...

sy dah buat dah tab menu mcm yang ditunjuk tu..tp bila press kat tab tu.page tu kuar di window lain..nak buat camane erk?mintak tunjuk ajar.tq

ika said...

assalmualaikum akak intan nurul fateha mcm mana nak buat page macam super k akak ?

AmayaKazuki said...

npe kt button yg dh wat tu ade gap??antara header n post??

leh refer sini ye...

http://iamnursyareenazmee.blogspot.com/

mumu:) said...

intan, camne nk buat benda scroll yg kat tepi tu mcmtu?

.:Binnabil_Huda:. said...

salam :D
akak , ble da bole buat y ats ni kan , nk ltak entry2 kt stiap tab menu tu cne lak ?
hehe ..

aisyah ecah said...

akak,xbleh nk bt la....npe xjadi sy bt???? =(

Anis Isel said...

Akak.Saya nak tanya.Camne nak wat floating Tab menu?

naz chubbylicios said...

ta mnjadikk un

iman hasanah said...

salam.. Nurul xdapat buat la... help me...

http://iman-hasanah.blogspot.com/

Hafsa said...

Salamss.. Cik Intan.. Saya dah faham tip n triks.. nyer..Alhamdullilah... Thanksss Yaa.. !!

 

About Me

My Photo
intanurulfateha
Muar, Johor, Malaysia
Eh, dah ada dua orang baby girl! ;) | Berdaftar dengan SSM, Double I Excellent Enterprise : JR0046896-W | For any inquiries, whatsapp 012-7186471
View my complete profile

#our journey

Friends since 2008
Getting Close since Nov 2010

Daisypath Anniversary tickers

Love is not a matter of counting the years, it is about making the years!

Daisypath Anniversary tickers

Alhamdulillah.. :')

Daisypath Anniversary tickers

Jantung, Hati, Limpa, Paru

Wanita di jadikan atas nama cinta.
Kalau cari, mesti jumpa.

Dan kamu,
Mohammad Noor Irfan;
Terima kasih kerana mencari saya semula!

Hep ! ! !
Curik hati kite ekk!

Tapi tak per..
Kite suke~

(^__^)

#irfanintanJR

#irfanintanJR
Aleesya Eryna

Kesayangan 31-3-13

Kesayangan 31-3-13