Tuesday, July 5, 2011

Tutorial : membuat header blog (transparent)

Assalamualaikum =)

ada sapa2 nampak perubahan kat blog aku? kalau tak nampak korang memang la. memang la apa aku pon taktau. ngeh3. dek kerana terlalu banyak masa senggang yang aku ada jadi aku mengambil peluang ni untuk mencomelkan blog aku. haha. gila skema ayat. 
kat post yang lepas aku ada cakap pasal header. aku nak cari orang yang boleh tolong buatkan header kat aku. tapi sapela aku ni kan. takleh la bajet famous sangat. so, aku guna la encik google untuk buat header blog aku sendiri. header yang lama tu serius aku dah muak tengok. tunggu la dua tiga hari lagi template ni pun aku campak ke longkang. memang sindrom cepat muak ni menyusahkan aku. :)

header lama yang aku buat sendiri jugak. serius tak lawa kan?

aku ni idok ler pandai sangat nak buat header sendiri. tapi dok search kat google tadi berjaya la jugak aku mencari tutorial kat blog orang. kalau tak paham sangat aku godek2 sendiri jer. 

okeh kalau ada yang sudi nak ikut cara aku buat ni sila ambil perhatian yer. baca dengan teliti. sebelum tu baca Bismillah dulu ek untuk hasil yang lebih berkesan.

*sebelum buat tu pastikan korang ada PHOTOSHOP ek!!

 
1. buka photoshop korang
2. lepas tu amik klik kat file dan pilih new
3.bila korang da klik dia akan keluar macam gambar kat atas tu. lepas tu korang tentukanla berapa saiz yang korang nak. dan pastikan saiz tersebut sesuai dengan header blog korang. saiz yang ada kat atas tu untuk blog aku
4. lepas tu korang pilih transparent ek. tu yang paling penting

bila dah klik ok dia akan keluar macam ni.

5. lepas tu korang ke file sekali lagi dan pilih open kalau korang nak masukkan apa2 gambar
6. bila dah pilih gambar yang sesuai korang boleh la crop gambar tersebut dengan menggunakan simbol yang aku bulatkan kat gambar di atas tu.lepas tu boleh la korang klik kat gambar dan crop gambar mengikut citarasa korang. paham tak?


7. bila dah habes crop korang klik kat simbol yang aku bulatkan tu dan drag gambar yang korang dah crop tu ke layer transparent tadi.

8. hasilnya akan jadi macam ni la.
9. mungkin gambar yang korang dah drag tu tak sesuai dengan saiz yang korang nak. jadi korang kena pergi kat edit pastu pilih transform dan korang boleh pilih la. scale ke. rotate ke. mana yang korang nak la.
10. guna la kaedah yang sama untuk gambar2 yang seterusnya. ikut kreativiti masing2

 hasil yang aku dah buat

 11. langkah seterusnya ialah memasukkan tulisan. sila klik pada simbol yang aku dah bulatkan tu

 12. lepas tu korang boleh tulis apa2 yang korang nak.
13. kalau korang perasaan font yang terbesar yang korang boleh masukkan cuma 72 bukan? jadi korang boleh gunakan kaedah 9 yang aku dah terangkan tadi.

14. untuk edit tulisan tu bagi lebih cun dan menarik, korang boleh tengok kat layer macam gambar kat atas tu. then korang kena right click pastu pilih blending option
15. bila dah pilih korang boleh la try and error yer. aku pun main hentam jer. kalau dah puas hati tekan jer OK.

 inila hasil yang aku dapat. 

16. bila dah berpuas hati boleh la save. pastikan korang guna save for web. bukan guna save as yer

* lepas dah save tadi korang dah upload kan? lepas tu ada tak border macam kat atas tu? kalau ada aku rasa macam menyemak jer kan. baik buang jer. lagi bagus. :)

17. langkah seterusnya korang kena pilih Design> edit HTML>dan cari   /* Header
18. korang tengok kat gambar di atas ni dia ada perkataan border kan? dan border yang kat template aku ni ialah 2px
19. tugas korang ialah gantikan angka 2 tersebut dengan angka 0

* ada dua perkataan border kan? maksudnya dua2 korang kena gantikan dengan 0 . maaf aku terlupa nak bulatkan. harap korang faham.
 * bila dah tukar pastikan korang preview dulu. kalau dah betul baru korang save.

tadaaaa. inila header aku yang terbaru. taktau sampai bila aku boleh menengoknyer. sebab aku ni jenis yang cepat boring.

ok kalau dah berjaya pastikan ucap Alhamdulillah. kalau tak faham tu jangan malu2 dan segan2 nak bertanya ek. 
* aku pun bukan pandai sangat.lepas ni aku kena belajar lebih lagi. kalau boleh aku nak buat header yang boleh gerak2 pulak. mudah-mudahan. :)

6 comments:

cik pha said...

header y lawa pink :)

nida husna said...

thanks.hehehe

bunga said...

lawa..dapat info kat cini..tq

nida husna said...

bunga: welcome

Polskahackrew said...

menjadik,..thanks..('',)

Blogger Blog Tutorial

alyn amalyn said...

blog ni comel..:)

kami

Daisypath Anniversary tickers

i love my blog

Daisypath - Personal pictureDaisypath Anniversary tickers