Cara Pakai Template Denim *like me*

Assalamualaikum.
Today aq nak share cara nak edit template Denim, macam yang aq pakai sekarang nih lah. (Saje, menggedik nak tunjuk-ajarku-sifu because takde keje XD) Okay, now ikut je langkah kat bawah ni kay.

First sekali, Login Blogger > Design > Edit HTML
Pastu tekan Select Layout Templates. Ala yang dekat bawah2 tu.
Dah? Okay good :)



Then, ikut step kat gambar bawah ni ea.


Okay now, look kat pic bawah ni.


Tengok, kan ada benda alah warna-biru-tak-cantik tu kan. Nak buang a.k.a nak transparentkan tak ? Alah, senang je *Ceh, ayat bajet lettew :P
Cari code ni at Design > Edit HTML

/* Variable definitions
====================

Jumpa, pastu cari anak buah dye yang ni pulak kay

<Variable name="headerBgColor" description="Page Header Background Color"
type="color" default="#336699" value="#336699">
<Variable name="headerTextColor" description="Page Header Text Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="headerCornersColor" description="Page Header Corners Color"
type="color" default="#528bc5" value="#528bc5">

Kalau dah jumpa, REMOVE code di atas ini dan gantikan dengan code yang ni :

<Variable name="headerBgColor" description="Page Header Background Color"
type="color" default="transparent" value="transparent">
<Variable name="headerTextColor" description="Page Header Text Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="headerCornersColor" description="Page Header Corners Color"
type="color" default="transparent" value="transparent">

Ha, look dye dah hilang kan. Good job everyone. (Y)
Sekarang kan kita guna template 2006. So mana boleh upload background camtu je. Jadi untuk tambah background yang kita suka kepada blog, cari code body { dan copy paste code ni dekat bawah code body { .

background-image:url(URL BACKGROUND YANG ANDA NAK);
margin: 0;
padding: 0px;
font: x-small Sans Serif, Arial;
text-align: center;
color: $textColor;
font-size/* */:/**/small;
font-size: /**/small;
}

Okay, kalau korang malas kan nak cari background yang cantik2. So take a look lah at these backgrounds. Kalau berkenan di hati, ambil lah satu ^^ (Bukan aq punya lah. Aq just upload masuk acc Photobucket aq. Tu je.)

http://i1209.photobucket.com/albums/cc382/nabilah_bieber/152.gif

http://i1209.photobucket.com/albums/cc382/nabilah_bieber/53.gif

http://i1209.photobucket.com/albums/cc382/nabilah_bieber/39.gif

http://i1209.photobucket.com/albums/cc382/nabilah_bieber/13.gif

http://i1209.photobucket.com/albums/cc382/nabilah_bieber/23.gif

http://i1209.photobucket.com/albums/cc382/nabilah_bieber/24.gif

Siap dah? Now rapatkan header dengan body pulak. (Kalau nak rapatkan boleh, taknak rapatkan pun boleh.) It just in case kalau korang nak guna header bersambung, bolehlah rapatkan header dan body dengan cara berikut :
Cari code #header-wrapper {
Dekat bawah code tersebut, copy pastekan ini -->

margin:0;
padding: 0;
background-color:transparent;
text-align: $startSide;
}

Wait, korang ingat dah habis ke? Belum lagilah sayang oi. Sekarang cari code ni :

#header {

Nampak kan code banyak2 yang dah beranak pinak kat bawah #header { tuh kan. Remove code2 tuh dan gantikan dengan code ni :

width: 761px;
margin: 0 auto;
background-color: transparent;
border: 1px solid transparent;
color: transparent;
padding: 0;
font: normal normal 210% Verdana, Arial, Sans-serif;;}

Siap. Hasilnya akan jadi lebih kurang macam kat bawah ni. (Btw that header isn't mine. Tu orang lain punya ya.)



Now, you're DONE ! Yay ! ^^
Boleh preview and Save Template dah.
Adios, Kthnxbye :D






P/S : Hope this tutorial help ya