8 July 2011

Edit Template SIMPLE. [Part 2]

Photobucket



Hola! Ingat tak semalam Kihah buat Tuto Edit Simple Template yang Part 1 punya. Ni Sambungannya. Kihah nak buat cepat-cepat. Nanti, tak lah tertangguh. Acc, Kihah baru balik dari Tusyen kat sekolah. Haha.

Cara Nak Buang Benda Warna Putih Kat Header
Tuto ni, Kihah pernah buat. Tengok sini. Kita buat Sekali lagi :D


SEBELUM. Tengok kat Header.


1.Dashbord > Design > Edit HTML
2. Find this kod /* Mobile
3. Dah jumpa? Pastekan kod ini atas kod  /* Mobile tadi.


.header-outer, .content-inner { background-color: transparent; }
.main-outer, .tabs-outer { background-color: $(content.background.color);}

#Kalau tak jadi, Copy yang ni pulak.
 .tabs-inner .widget ul { margin: 0px -15px;}
.content-inner{padding: 0px;}

4. Preview, and SAVE. Ni Hasilnya:




Cara nak buat Header Bersambung Dengan Blog
Kalau nak buat, mesti ada Gimp dengan Photoscape. Hee. First, Buka Gimp

Tekan CTRL+N serentak. Keluarla kotak automatik.

Width untuk Denim template ialah 761 ( Melainkan korang dah ubah ) So tukarkan Width jadi 761. Height boleh tukar ikut suka hati. Jangan tekan OK lagi! Korang tekan simbol + sebelah  Advanced Options dulu. Nanti keluar macam ni : 


Kan ada bahagian Fill with: tu kan? Sebelah dia pulak Background color kan? Tekan arrow kat situ pastu keluar drop down menu. Pilih Transparency. Then tekan OK. Nanti keluar camni :


Jeng jeng jeng. Sekarang kat bahagian toolbox tu, pilih button kotak then bawah tu pilih rounded corners. 

Yang kat radius kat bawah rounded edges tu ubah jadi 20 - 60 camtu. jangan banyak sangat.



Sekarang korang bawak mouse korang kat bakal header korang punya hujung. Tarik dia sampai memenuhi bahagian bawah header korang. kalau terkeluar pun takpe. nanti dia jadi dashed ( - - - - - ) macam ni : 

dashed tu bergerak. sbb tu tk nmpk sgt kay.
Sekarang, tekan Brush tool pulak. tukar kan color jadi warna putih. pastu just color kan dekat bakal header korang tuu.

Tengok gambar .
Kalau time nak warna kan tu, warna kan je cacai barai. dia takkan ganggu bahagian luar sbb td korg dah highlight hujung header korg tu :D
Ni baru siap dia punya bahagian untuk sambungkan pada blog T_T hehe
headeruntuktesterblog.PNG
Skrg untuk edit di photoscape pula. Savekan bakal header korang tadi. Savekan jadi .PNG file tau. contohnya :  headersaya.PNG
Bila tekan Save , nanti keluar kotak mcm ni :

bila keluar kotak ni, tick ikut gmbr di atas ok :D Tick  Save Resolution dan Save Creation Time SAHAJA.
Sekarang bukak bakal header korang dekat Photoscape.
Nanti bila bukak nampak semua putih kan? Jgn risau! sbnrnya header korang still transparent. Cuma dia tak tunjuk transparency je.
DIINGATKAN BAHAWA VIEWER DIA MMG CMTU. nmpk semua putih tp ekcuali dia transparent. Korang edit-2 lah & letak gmbr semua tu *Doodle tu saya yang buat okay!*. Pastu Save jadi .PNG file. takpun korang tekan butang Save terus. takyah tekan Save As. Kalau korang tak caye dia transparent, cuba bukak dekat folder. Anyway, upload la ke blog korang. 
Tengoklah blog anda. =) Cantik tak? Jadilah macam ni

Kalau dia tak sama dengan Main Blog, pergi Dashbord > Design > Template Designer > Adjust Width. Adjust sampai boleh ok. :D
Bye.

29 comments:

  1. Ini yg saya cari selama ni !
    Apapun, saya tau awk lah admin blog D . yEAHa !

    ReplyDelete
  2. kak , kenapa untuk template designer tak boleh bersambung header dy dengan body ea lepas upload ?

    ReplyDelete
  3. salam, kihah............... saye suka dengan tuto ni.... tp mcmne nak dptkan 'gimp' tuh yer??

    ReplyDelete
  4. dik, nape background nye x smpai ke bhgian header ? biru je background diee~

    ReplyDelete
  5. @Faqihah Husni adik akk dah buat lepas tu gambar nya tak ada lah dek?

    ReplyDelete
  6. ade tak tuto nk buat header bentuk awan ???? ajar please

    ReplyDelete
  7. slm, dik knpa akak bt mc jga x bsmbung header dgn body ar?

    ReplyDelete
  8. kihah , macamana nak paintbrush warne putih tue ?

    ReplyDelete
  9. @Nur Amira tak ada? aikk. akak save kat mana? pandai2lah akak cari

    ReplyDelete
  10. Thanks 4 the tuto , good luck 4 you exam , wish me luck too , okiee ?

    ReplyDelete
  11. Qihah, macam mana nak hilangkan nama kita dekat atas tu? (yang tulisan biru)

    ReplyDelete
  12. @Anis Farhana Tulisan biru? tulisan biru mana satu? :)

    ReplyDelete
  13. Dah jadi.Terima kasih qihah :)

    ReplyDelete
  14. tak jadilah...die x transparent p0n...pastu yng k0tak masa nak save tu p0n x d cmtu...camne yer qihah..hrap dibntu

    ReplyDelete
  15. Habat! Dh lma akk cri tutorial ni..

    ReplyDelete
  16. salam. how about template baru 2016? takde code mobile

    ReplyDelete
    Replies
    1. wa'alaikumussalam. do contact me personally throught twitter/email/facebook for further. I can't view ur blog to look for way :)

      Delete

Your words defines you