Wednesday, May 18, 2011

[Tutorial] Rapatkan Header Pada Body Blog

Salam readers~


Pagi2 nie yana bangun, bukak blog. Cadang2 nak update lah konon. Tapi tak tau topik hape nak cakap. Ehee. Jadi yana berterima kasih kepada sorang unnie nie yang tanya pasal tutorial hari nie. So,tanpa membuang masa jom kita mulakan! :D

1. Dashboard > Design > Edit Html


2. Ctrl + F untuk cari code nieh :
/* Header


3. Dah jumpa tu korang scroll down pelan2 da nakan jumpa code nieh pulak :
border: 9px solid $headerBgColor;


4. Gantikan 9px kat atas tu dengan 0px. So akan jadi mcam nieh :
border: 0px solid $headerBgColor;


5. Tak paham? Tengok kat bawah nie :


*Get it?*


6. Preview. Kalau takde apa2 error just tekan Save. Siap! :)






UPDATE


Kalau korang takde code macam kat atas nie, korang guna cara nie pulak.


1. Dashboard > Design > Edit HTML


2. Ctrl + F search for this code :
#content-wrapper {


3.  Dah jumpa? Tengok kat bawah2 tu sampai jumpa code nieh.
border:1px solid #000000
-moz-border-radius:10px;


dah jumpa tu gantikan code tu dengan code yang kat bawah nieh :
border-left:1px solid #000000;
border-right:1px solid #000000;
-webkit-border-radius-bottomleft:10px;
-webkit-border-radius-bottomright:10px;
}



Tak paham? Picit gambar kat bawah nie untuk tumbesaran dugro :)


Sebelum :


Selepas :



Ehhh? Nak pegi mane tu? Nanti dulu. Tak habis lagi la. Korang kena modify korang punya header pulak. Tapi yana tunjuk guna photoshop cs5 ye? Sebab yana buat header guna tu je. Kalau yang photoscape yana tak reti. -.-'


1. Bukak photoshop tu > Ctrl +N untuk dapatkan New Layer


*Picit untuk tumbesaran dugro*
Yang kat width dan height tu korang boleh ubah ikut saiz body korang ye.


2. Tekan kat keyboard korang huruf U. Nanti secara autonya dia akan ke tool yang kita perlukan tu.




Yang kat num 2 tu korang boleh pilih nak bentuk dia jadi macam mana nanti. Yang ketiga tu kalau korang nak bagi lengkuk gambar tu besar korang boleh adjust sendiri. Then yang kat num 4 tu boleh tukar color ikut color body blog korang. Then baru buat macam benda putih kat atas tu. Selesai?


3. Korang select pulak move tool yang kat atas sekali tu untuk move benda putih tu. Korang tarik la samapi bawah mana yang korang nak. Kalau gamba tu tak sama besar dengan width korang yang awal tadi, korang boleh adjust sendiri. Ctrl + T untuk adjust.




4. Then buatlah header korang tu. Rujuk gambar kat bawah nie :




5. Then macam biasa korang letak header yang korang baru buat nie kat blog korang tu. Siap! :)


Sekian :]

No comments:

Post a Comment

Thanks for comment. Come again! ^_^