Thursday, August 18, 2011

Tutorial : Transparent Header (Template Designer)


hye :)

hari ni tak de keje nak buat, so tibe-tibe terjumpe tutorial. tutorial ni memang dah lame aku cari. aku buat ni pun untuk kemudahan sendiri jugak. sebab malas nak searching searching pasni.

dulu, penat aku design transparent header untuk blog ni pakai photoshop. bile aku upload, tak menjadi. punyelah bengang. berkat kesabaran (..konon), aku jumpe gak akhirnya. credit to pen-doodle comel ini :)) sebab mule mule aku ingat yang pakai template designer ni memang tak boleh buat header transparent. rupe-rupenye bole. #lompat kegembiraan :p

jom start !

1. Dashboard > Design > Edit HTML > click Expand Widget

2. Ctrl + F, cari code ni:
 /* Mobile

3. Kalau dah jumpe, copy code kat bawah ni pulak:
.header-outer, .content-inner { background-color: transparent; }
.main-outer, .tabs-outer { background-color: $(content.background.color);}
 
4. Paste kan dekat atas code /* Mobile tadi.

5. Dah siap ? cer preview. kalau jadi, tekan save okey :)


PERHATIAN : make sure korang punye header tu, memang korang buat die jadi transparent. biasenye dalam bentuk png. paham ke ? *berterabur gile ayat :p


8 comments:

ashikinzulkefli said...

thanks. muahmuah

✿ n.i.e.y.x.z.h.a ✿ ™ said...

tenkiu so much! dah menjadikkkk :)

Felicia Richard said...

thank you for this tutorial. it's very helpful! :D

ELFarahin said...

oh...baru tahuuu...thanx! ^^ follow here :)

Ashjbxoxo said...

Thank u so much ! ;)

YatieOwner said...

thanks for sharing this syg ;)
saya da pakai, and sgt berguna :)

Syera said...

same-same semua :))

Firzz Radzi said...

xmenjadi...dah save dlm PNG, tp header jd hitam...