✿ tutorial : 3 column ✿

Step 1

Layout >>> edit html
Pastikan klik Expand Widget Templates

******************************************************************

Step 2

Cari >>> #header-wrapper {
Ni tuk tukar saiz header

Cara nk cari
1. Copy code kat atas ni
2. Klik Ctrl + F
3. Paste code td

Pas tu edit

#header-wrapper {
width:880px; >>>>>>> tukar kan kepade 880
margin:0 auto 10px;
border:1px solid $bordercolor;
}

******************************************************************

Step 3

Ni tuk tukar saiz sidebar
Cari >>> #sidebar-wrapper {

#sidebar-wrapper {
width: 220px; >>> tukar kepade 220
float: right; >>> tukar kepade right
word-wrap: break-word;
overflow: hidden;
}

******************************************************************

Step 4

Tambah lagi satu code kat bawah code tu
Copy code ni
Pasti kan copy selepas tande }

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

Sekarang dh de 2 column, kiri ngan kanan

******************************************************************

Step 5

Cari >>> outer-wrapper
Pas tu edit

#outer-wrapper {
width: 880px; >>> tukar kepade 880
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

******************************************************************

Step 6

Cari code ni >>> div id='main-wrapper'
Pas tu copy code ni kat atas code td tu




******************************************************************

Step 7

Cari code ni >>> #main-wrapper {

#main-wrapper {
width: 410px;
float: left;
margin-left: 20px; >>> tambah code margin-left ni
word-wrap: break-word;
overflow: hidden;
}

******************************************************************

Step 8

Save

******************************************************************

Step 9

View kowg nye page element kat layout dulu… bile dh ade due2 sidebar, cube alihkan satu gadget kat sebelah yg lagi satu tu…pas tu save…view blog…

******************************************************************

Insyallah jadi…
Selamat mencube…


******************************************************************

rujukan : blog ceera

---

|| THANKS for READING ||

---