Thursday, February 7, 2013

Tutorial Curved-kan Body & Buang line bawah header (Template Designer)

Assalamualaikum ;)

Oke tak belog syera ? Hoho. Sikit punye susah syera nak pikir nak hias camno blog ni. Ni pom sebenarnye belom siap lagi. Tapi sebab tak nak blog ni macam sepital, sunyi je, syera buatlah tutorial. Nampak tak body blog ni curve kat atas tu ? Contoh gambar, kat bawah..



Jom syera ajar ;)

1. Dashboard > Template > Edit HTML > Tick Expand Widgets

 


2. Ctrl+F and cari kod kat bawah ni :



.main-outer {


3. Jumpe ? Kalau dah jumpe, copy and paste kod bawah ni, kat bawah kod .main-outer { tadi.



border-radius:20px;
Contoh :


4. Dah setel, cube preview. Kalau okey, boleh save ;))

Warna biru tu, level curve die. Betul ke namenye level ? Errr..tak tahu camne nak explain =..= Tapi korang boleh adjust kat situ. Macam syera punye tu, syera buat 40px untuk nampak lebih melengkung.

Next, ade nampak tak line kat bawah header tu ? Okey, now, nak buang mende alah tu pulak.

1. Ctrl+F, cari kod ni :



/* tabs


2. Kat bawah die ade kod macam ni :



.tabs-inner .section:first-child {
border-top: 1px solid #eeeeee;
}
atau, ade sesetengah blogger, macam ini



.tabs-inner .section:first-child {
  border-top: $(header.bottom.border.size) solid $(tabs.border.color) ;
}

Okey, untuk kod yang atas tu, yang warna purple tu, tukar kepada 0px. Atau yang kaler hijau tu, delete je.

3. Then cube preview. Kalau okey, boleh la lompat kegirangan. Eh ? boleh save :)