24 February 2010

Jadikan Blog 3 column




Pergi ke layout - edit html... jangan lupa tick kat yang ada kat belah kanan tu...

Then... untuk penukaran saiz header.. ini codingnye...


#header-wrapper {
width:880px; <--- tukar yang ni saje, kasik 880
margin:0 auto 10px;
border:1px solid $bordercolor;
}
 
Dah siap kita mula untuk penukaran saiz sidebar 





#sidebar-wrapper {
width:
220px;
float: right;
word-wrap: break-word; }


Lebar page sidebar tu,boleh ubah-ubah tapi kena la telly ngan layout ok.




#left-sidebar-wrapper {
width: 220px;
float: left;
word-wrap: break-word;
}




So akan ada 2 side bar.  satu kanan satu kiri .Pahtu ada lagi tau



#outer-wrapper {
width: 880px; <--- TUKAR kat sini
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}


ini untuk menentukan imbangan side kanan dan side kiri korang so xdalah nanti senget sebelah,

Ok siap satu dulu..KEMUDIAN....

Cari coding nie plak ---> <div id = 'main-wrapper'>


<div id ='left-sidebar-wrapper'> <b:section class='sidebar' id='left-sidebar' preferred='yes'/></div>


Ok copy code nih  ATAS coding yang korang cari tadi.


Yang terakhir untuk MAIN WRAPPER lak..




#main-wrapper {
width: 410px;
float: left;
margin-left: 20px; <--- atau ko leh buat 10px

word-wrap: break-word;
}


Tujuan penambahan ini untuk mendapatkan ruangan di antara spacing side bar kiri kanan ok.


Ok dah settle.Nanti VIEW dulu sebelum save ok.


Comel harap korang paham la ape yang cuba comel sampaikan nih..dan usaha korang berjaya insyallah....




4 comments:

♫::: m[e]n!t! s[e]nja :::♫ said...

waa...
dah pandai bg tutorial tue...
hehehehe...

**Bila Comel Jadi Comot** said...

huhu meniti kongsi sikit ilmu yang dapat

yana2605 said...

aiyoo...susah nya..nie kena ambik masa nak kaji nie..tolong buat kan bole tak??heheheheh

**Bila Comel Jadi Comot** said...

heheh- senang jer yana mula2 nmpak susah lame2 u mesti akan expert pollow the sequence je

Cuba Klik tengok apa jadi!