main and sidebar terpisah

Wednesday, October 31, 2012


Annyeong...



hari ini julia nak buat tutor main wrapper and sidebar wrapper terpisah..
tutor ni direquest oleh adik Anis..
nak tau,mari mulakan..

1.log in-->dashboard-->design-->edithtml--?tick expand widget

2.search kod ni:

BAGI PISAHKAN MAIN WRAPPER:
.post { 
3.copy and pastekan code ni kat bawah code no.2:
border-top: 1px solid #AC58FA ;
border-bottom: 1px solid #AC58FA ;
border-right: 1px solid #AC58FA ;
border-left: 1px solid #AC58FA ;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20x;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
margin:0 0 1.5em;
padding:10px;
font-size: 95%;
background:#ffffff;
border: 1px solid #ffffff;
line-height:1.9em;
}

Tapi sebelum itu,dekat bawah .post { tu ade kod lainkan macam kat bawah ni:




yang kat bawah .post { tu delete k?

4.da siap ~SAVE!

yang ni pulak bahagian sidebar wrapper:

1.search kod ni:

.sidebar .widget {

2.copy kod ni and pastekan kat bawah kod no.1 tadi:
**tapi sebelum tuh,nampak tak code camni:


tolong delete kod tu yeh!!.Lepas tu baru copy and pastekan kod kat bawah ni:

border-top: 1px solid #AC58FA ;border-bottom: 1px solid #AC58FA ;border-right: 1px solid #AC58FA ;border-left: 1px solid #AC58FA ;-moz-border-radius-topleft: 12px;-moz-border-radius-bottomright: 12px;-moz-border-radius-topright: 12px;-moz-border-radius-bottomleft: 12px;-webkit-border-top-left-radius: 12px;-webkit-border-top-right-radius: 12px;-webkit-border-bottom-left-radius: 12px;-webkit-border-bottom-right-radius: 12px;margin:0 0 1.3em;padding:10px;font-size: 95%;background:#ffffff;border: 1px solid #ffffff;}

3.da siap~SAVE

**tapi sebelum tuh,preview dulu,takut x menjadi,kalau x jadi boleh tanya julia k?


4.**yang kod yang perlu diubah tu korang tak perlu ubah lagi~julia da edit sikit supaya sesuai dengan kelebaran blog korang.hanya perlu copy and paste lepas tu save~



5.TUNGGU!!julia lupa satu lagi~
lepas tu,korang pergi k template designer
tekan advanced -->main background colour-->pilih pada colour itu TRANSPARENT!/(tulis kat box tu,TRANSPARENT!)


6.lepas tu,pergi pulak k edit html-->search kod ni:

# content-wrapper {

7.nampak tak kod ni:


  margin: 0 2%;
  padding: 0 0 15px;
  text-align: $startSide;
  background-color: $mainBgColor;
  border: 1px solid $borderColor;
  border-top: 0;
}


8.no yang berwarna merah itu tukar kepada ~0