Selasa, 31 Maret 2009

Menambah Colum pada Blogger

Bagi yang suka utak-atik template, mau belajar memodifikasi template blogger, saya akan menulis tentang modifikasi template minima blogger yang sidebarnya di kanan, minima right sidebar. Aselinya, minima hanya mempunyai dua kolom, di kiri atau di kanan, dengan lebar kolom 220px.

Langsung tanpa basa-basi, to the point aja. Kita akan memulai dengan menambah satu buah kolom/ sidebar dengan lebar 160px. Ini cocok untuk menempatkan iklan adsense yang skycrapper.

Pertama:
Buka layout --> edit html --> back up dulu script aseli blog anda.
Buatlah style css (tentu di antara [c: data ....
buat properties berikut:

#sidebar1-wrapper
{ width:160px;
float:$startSide;
margin-$startSide:10px;
word-wrap:break-word;
overflow:hidden;
}

Tuesday, March 25, 2008
Modifikasi Template, 3 Column Minima Blogger

Bagi yang suka utak-atik template, mau belajar memodifikasi template blogger, saya akan menulis tentang modifikasi template minima blogger yang sidebarnya di kanan, minima right sidebar. Aselinya, minima hanya mempunyai dua kolom, di kiri atau di kanan, dengan lebar kolom 220px.

Langsung tanpa basa-basi, to the point aja. Kita akan memulai dengan menambah satu buah kolom/ sidebar dengan lebar 160px. Ini cocok untuk menempatkan iklan adsense yang skycrapper.

Pertama:
Buka layout --> edit html --> back up dulu script aseli blog anda.
Buatlah style css (tentu di antara [c: data ....
buat properties berikut:

#sidebar1-wrapper
{ width:160px;
float:$startSide;
margin-$startSide:10px;
word-wrap:break-word;
overflow:hidden;
}

-Keterangan: $startside nama elemen untu kiri/ left.
- word-wrap:break-word :> untuk memecah kata yang terlalu panjang (IE) sehingga tidak menggeser lebar sidebar.
-overflow:hidden:> menyembunyikan kata yang melebihi lebar sidebar (Firefox).

Selesai membuat calon sidebar.

Dengan membuat satu sidebar maka kita harus menambah ukuran lebar untuk outer-wrapper dan header-wrapper. Berapa px lebarnya? Kita sudah membuat calon kolom dengan lebar 160px di tambah margin kiri: 10px, jadi space buat kolom baru: 170px.

ini yang harus diubah:

cari: #header-wrapper { width:660px; }
lebar semula --width:660px, ganti menjadi 660 + 170 = 830px;
cari: #outer-wrapper :> sama dengan di atas.


"


"
"


Original from

Tidak ada komentar:

Posting Komentar