Mengubah saiz lebar column template classic

Kepada anda yang menggunakan template classic yang biasanya mempunyai 2 column, ukuran bagi lebar column tersebut sebenarnya boleh di ubah mengikut kehendak anda. Untuk mengubah siaz kelebarannya, anda perlu mengikut beberapa langkah dibawah.

p/s: Sila save script template terlebih dahulu sebagai backup.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML. Seterusnya tick pada kotak Expand Widget Templates.


Langkah 2

Dengan menggunakan keyboard, tekan Ctrl+F. Seterusnya taipkan kod #header-wrapper { pada kotak Find. Kemudian, tekan Enter. Anda akan lihat kod yang mungkin hampir sama dengan kod yang dipaparkan di bawah.

#header-wrapper {
width:660px;
margin:0 auto 10px;

Edit angka 660px kepada 900px .


Langkah 3

Taip kod #outer-wrapper { pada kotak Find dan tekan Enter. Anda akan lihat kod yang mungkin hampir sama dengan kod yang dipaparkan di bawah.

#outer-wrapper {
  width: 660px;
  margin:0 auto;

Edit angka 660px kepada 900px.


Langkah 4

Taip kod #main-wrapper { pada kotak Find dan tekan Enter. Anda akan lihat kod yang mungkin hampir sama dengan kod yang dipaparkan di bawah.

#main-wrapper {
  width: 410px;
  float: $startSide;
  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 */
  }

Edit pada angka 410px kepada 660px.


Langkah 5

Taip kod #sidebar-wrapper { pada kotak Find dan tekan Enter. Anda akan lihat kod yang mungkin hampir sama dengan kod yang dipaparkan di bawah.

#sidebar-wrapper {
  width: 220px;
  float: $endSide;
  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 */
}

pada angka 220px kepada 230px.


Langkah 6

Akhir sekali klik preview. Jika tiada mesej error yang terpapar dan anda berpuas hati dengan hasil yang telah di edit itu. Klik Save
Mengubah saiz lebar column template classic

dah try buat...tapi tak jadi gak..tension...

macam perli gua.
terasa siak.
HAHAHAHAHA

yahooo............ dah boleh wat dah nes.. tq sbb tunaikan permintaan ramai. tp nes... bila cik jah tukar sidebar kpd 240px. sidebar jadi duk bawah body. cik jah maintainkan saiz sidebar. just adjust saiz body tu je. tq cfu

suka la dgn info ni.. tahniah kerana didikan dan tunjuk ajar ni :-) terima kasih

aiseh mende ni pun gua nk buat... jadi bile gua bleh setat wat keje rasmi opis kalau gini? ah skang gua pangkah page ini... tata

okeh dh siap... lega rase... baru la tenang ati

thanks bro..atas tips yg diberikan..besau skit aku nyer blog tu..klu tak sempit jer rasa..nk bernafas pn rimas..huhu...kredit tu mr nescafe...
p/s-bang nescafe ais satu lagi...hehe

oh yeahh~ wa nye bahagian tulisan2 tu dah lebor skekk!

mekaceh incik nescafe!

classic je???cam aku pnyer nak kasi sidebar lebih cket ngn kt bahagian content...sidebar bhg ads tuh..

@Legasi Piston Pecah

Boleh juga kalau nak edit. Tapi kena tengok, sidebar background tu pakai image ker warna. Takut dah edit nanti jadi berterabur pula sidebarnya. Kalau nak edit juga, edit angka pada #sidebar-wrapper {. Namanya lebih kurang juga. sidebar

salam...saya baru je jumpa blog ni. baru nak start blogging..mmm..thank you untuk info ni...tapi...

"p/s: Sila save script template terlebih dahulu sebagai backup."

macammana nak save script template tu..erkkk..tq

...oh, dah jumpa caranya...tq... =))

salam.encik nescafe..
saye newbie dlm dunia belog niey
nak mintak tolong selesaikan permasalahan lah
cuba view niey
http://farhanaabdghafar.blogspot.com/
saya dah ubah dah background position : center@elft@right
tapi still tak betol jugak.
nak tarik bunga kerawang tu letak kat tepi sekali.
tak nak bagi terganggu sidebar tu,
camne ek..
ke, background picture yang tak cukup besar??
huhu
hope encik nescafe ley tolong.. tq

tenkiu bebanyak...

already tried diz! thanx alot~

thnx nes. da jadi. sila la ke blog baru saya

sekarang blogger kt blogspot lg sng nk tuka saiz ni sb terdapat setting yg baru.. tak perlu untuk edit html

kenapa dr awl copy n paste lg for the fist step tu it said "phrase not found'???

@FIFIEY LYCHEE MARATION
same lah.
padahal guna classic jugak.
:(

bagus btol tutorial ni..barula kemas blog...