Cara Tambah Kolum Pada Blog Dua Kolum

Monday, 5 July 2010




Sebelum


Selepas

Kolum ni orang putih cakap column hehe.. mukaddimah jap haha... Kali ni saya nak share macam mana cara nak tambah kolum daripada templete dua kolum menjadi tiga kolum haha... Sebenarnya cara ni saya baru jumpa setelah tergodek-godek nak buat templete sendiri tapi masih tak berhasil kerana tak reti haha... Akhir sekali cara yang senang pun datang iaitu menggodek templete yang sedia ada dan templete yang saya godek-godek ialah templete yang berada didalam layout yang disediakan oleh blogger. Templete ni boleh diperolehi dengan membaca post saya yang lepas iaitu disini hehe... Cara-caranya ialah:

1. Korang cari kod seperti dibawah ini dalam template korang..(pastikan float bagi #outer-wrapper, #main-wrapper dan #sidebar-wrapper adalah sama). Jangan lupa backup templete asal terlebih dahulu..

#outer-wrapper {
width: 927px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}

#main-wrapper {
padding:10px;
width: 467px;
margin-left: 36px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}

#sidebar-wrapper {
padding:10px;
width: 163px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}


2. Selepas korang tambah kod bewarna biru dibawah kod merah seperti diatas

#sidebar2-wrapper {
padding:10px;
width: 163px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}


3. Tekan butang cntrl+F untuk dan cari kod <div id='main-wrapper'>
Paste kan kod dibawah ni sebelum atau diatas kod
<div id='main-wrapper'>

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


Kalau korang buat tak jadi gak pandai-pandai la godek lagi ek hehehe... godek kat google sekali tu haha..

12 comments:

suka_haha said...

good info here...

suka_haha said...

macam mana nak buat tutorial tajuk kat ats tu yer...
home
tutorial
award
contest

suka_haha said...

wahhh...tahniah wahai mat din ku syg....qiqi mmg xrti bab2 nie..ekekekke...cian matdin tny ritu=)

suka_haha said...

nice info..

suka_haha said...

hehehe.. nasib hehe

suka_haha said...

yg tu sy terlupalah kat mana saya jumpa tutorial dia.. nnt2 kalau rajin sy try buat lagi yer hehe..

suka_haha said...

tq matdin tlg td...hehe...thumbs up la

suka_haha said...

sama-sama hehe

suka_haha said...

thanks

suka_haha said...

thanks

suka_haha said...

ala..rumit..slalu klu edit html mst ad error..nape ek..

suka_haha said...

step 3 silap sikit.. baru baiki..