 |
| Ni la rupa tab menu yang aku wat! Buruk kan contoh aku wat :( |
Finally, aku wat tutorial ni! ;) Susah gak nak wat kan.. As requested by Mar & Cute Mummy Fara, aku wat tutorial ni, err tengah wat.. dah abes wat jap lagi? Whateverla. Ni la kesan wat tutorial malam2 buta camni ==" Tak payah bebel lagi la kan. Tengok je step2 dia okay! ;D
Create Design for Tab Menu
Aku guna Adobe Photoshop CS2. Siapa de or nak guna selain dari ni, boleh je. Ni aku just tunjuk contoh je.. macam touching je bunyi, haha
Buka Adobe Photoshop CS2 > File > New
Width: 200pixels (ikut kesesuaian korang)
Height: 80pixels (ikut kesesuaian korang)
Color Mode: RGB Color; 16bit (amek bit yang paling besar)
Background Contents: Transparent (ikut kesesuaian korang)
Terhasil satu layer! :)
Duplicate layer tu supaya kalau salah wat ke senang korang nak edit. Just right click kat “Layer 1” & click “Okay”
2) Radius: 30px (Ikut kesesuaian korang – untuk curve)
3) Color: #faf453
4) Click cursor kat tempat korang nak wat rectangle tu & just drag. Dia akan jadi rounded rectangle dengan sendirinya! ;D
Kalau nak resize just tekan ctrl+t. Kalu korang tak selesa dengan radius tu, just g tab history kat tepi & delete mana2 history yang korang nak delete, kira macam undo la.. Guna je tab tu bila mana korang nak undo ;) Bila dah ok, puas hati, dah resize, tekan ctrl+alt+enter untuk kasi gambar korang lawa & tak pecah!
Sekarang masukkan tulisan..
1) Wat new layer
2) Click Horizontal Type Tool
3) Tulis pe yang korang nak, eg; Tutorial
Editla pe yang patut; color, size, font… (semua kat tab atas). Then, ctrl+alt+enter
File > Save for Web > Okay
Letak Tab Menu ke Blog
First korang kena upload dulu tab menu yang korang wat tu kat Photobucket. Then copy HTML kod tab menu korang dalam HTML gadget.. HTML gadget mana nak cari? Mesti korang tau kan.. Takpelah, aku bagitau lagi k.. Dashboard > Design > Page Elements > Add a Gadget > HTML
1) Highlight satu2 tab & linkkan ke page yang korang nak.
2) Create Link ke page yang korang nak tu.
3) Masukkan url page.
p.s; Jadi tak korang wat?
34 comments:
huhu..tora x reti lgsg wat mende alah ni =) xpe3 tora blh bljr kt cni nti hehe..tq =)
@MiSs TOrA tak kesah pon sbnarnye.. bole je design tab tu gune photoscape or pape yg tora rase selesa nak gune ;) yg penting, care nak upload & linkkan ;)
Bagus..tapi akak kena study bebetul dulu
@zmahIt's okay, take time ;) saye pon masih lagi blaja gune photoshop ni. but this one is just basic.
kak sofia thanks bebanyak ye layan request sya,.tgh berusaha buat smbil2 update blog,.
@Mar same same. ok, take time :)
thank you sofia.. nanti akak cuba dulu ek.. dah berjaya akak bagi tau.. hehehe.. thanks again..
@❦ CuTe MuMmY FaRa ❦ ok! ;) your welcome kak..
sy dah try wat tapi knpe tab menunye tak berada diatas daripad background ea .. dye ad tol2 kat paper background atas sekali . napew ea ?
@Zulhud Ibrahim Awak kena letak gadget html utk tab menu tu betul2 bawah "header" & kalau nak die jadi cam saye punye means belakang tab takde bakground, g kat..
Design > Edit HTML > search #outer-wrapper { gune ctrl+f
then tukar background colour jadi transparent.. macam ni..
background: transparent
saya menjawab soalan tak?
ok2 i try ya .
tapi sy dah cari perkataan ni sy cari ta de lahhh .. cm ne nak wat nieyhh ?
@Zulhud Ibrahim dah search kod..
#outer-wrapper {
tak jumpa?
or kod yang camni?
#outer-wrapper {
width: 1000px;
background: transparent;
margin:0 auto ;
padding:0px;
text-align:$startSide;
font: $bodyfont;
}
tlg buad kan untuk sy boleh tk ? sy tkde photoshop cs2 lah . balas kat shoutbox sy tau
hmm sy taknak yg tutorial tab tuu . ala yg mcm biase je . tab owner , tab story .
tq so much..amat berguna kepada saya yg masih lagi bertatih dalam menulis karya di blogspot ini
@shahjiehan your welcome :) teruskan berkarya!
salam..
nak tanye bleh =)
kalo sy nak mskkan byk2 url cmne??
contoh cm nak listkan semua tutorial yg ade dlm blog..
kte kene buat pages baru ke ape??hee ^__^
tutorial nie besh =)
@nurul amira list tutorial cam saya wat tu ke? kalau cmtu, just list down tutorial yg de then linkkan satu2 ke page tutorialnya..
yup, wat kat page baru utk list tu :)
kalau de masalah, tny k.. tp saye susah cket nk on9 dlm 2minggu ni. huhu.
ok2 dapat da =)
makacih banyak2 share tutorial nie..^__^
@aiynn
hmm kak , macam mana nak buad tab baru ? bler kyte click STORY dea keluar story kyte jeh . bler kyte click OWNER dear keluar pasal kyte jeh . cm ne heh ?
@Sofia Aimd
Kak , Alhamdulillah . akhirnya menjadik :) saya buad dekat blog baru sy . blog lama sy dah tak boleh pakai . nyy blog baru saya . http://love-is-you-johann.blogspot.com/ . alhamdulillah dah menjadik . thanks too much ye akak . :')
@Sofia Aimd
Kak , Alhamdulillah . akhirnya menjadik :) saya buad dekat blog baru sy . blog lama sy dah tak boleh pakai . nyy blog baru saya . http://love-is-you-johann.blogspot.com/ . alhamdulillah dah menjadik . thanks too much ye akak . :')
@nurul amira same same :)
@Aiynn Darel sory, de problem nak on9 wat mase skg ni. ni pon on9 jap je.. dah setel ea prob awk. sory ea. tak sempat bace pon lagi komen tu dah setel. huhu.
hyehye. saya dh bt sudah menjadi. thanks sis :)
hey..
nk tnye npe sye buat jdi tegak.xjdi melintang.
1 lagi kak buat cm ner list kt tutorial tu.cntoh:tutorial pas tu bawah2 die da menu tab,icon kt sblah title.n per2 ag.hope akak boleh tlg ajar kn
@buxcuk Dhia~ ouhh, mase awk masukkan html tu mesti awk enter kan tiap kali nak masukkan html next tab. so, that's why, die ke bawah. so, carenye, awk letak html tu sambung je, tak yah enter. or just edit kat 'rich text' & delete space between the tabs..
Untuk list tutorial tu akak just list down then hyperlink ke page2 tutorial..
Anything yg tak paham, tny k! :)
@Sofia Aimdowh thnx kak :]
tapi yang list tutorial tu kurang jelas larh kak..kak boleh bgtw lebih detail x..:]
@Sofia Aimdowh thnx kak :]
tapi yang list tutorial tu kurang jelas larh kak..kak boleh bgtw lebih detail x..:]
@buxcuk Dhia~ utk list tutorial tu.. mule2 akak list down dulu tutorial pe yg de kat blog akak. then akak link kan tiap satu tutorial tu ke post masing2.. kaedah die macam kt wat link kat entry.. okay? :)
sory kak..
akak leh x wt tutorial tu leh x.
xpaham larh..
hope sgt2
saya dapat buat thnks eah :)
hai!
kenape bile sye buat tuto nie..
da jadi...tapi bile klik kat words tu..
die bukak pages lain(pages photobucket)
please tergkan....
tq.
Post a Comment