Tutorial Menambah Kolom di Blogspot

Ingin menambah kolom blog anda menjadi 3 kolom? bingung bagaimana caranya. Sebenarnya menambah kolom di Blogger/blogspot caranya sangatlah mudah, anda bapat mengikuti tutorial menambah kolom di blogger/blogspot di bawah ini. untuk percobaan sebaiknya anda membuat blog baru yang khusus buat bahan percobaan(belajar dulu... ) digunakan untuk menambah kolom di blogspot/blogger lebih mudahnya pilih template yang minima saja. atau bisa juga anda backup template blog utama anda dulu( jaga2 kalo gagal gampang benerinnya)
sebagai bahan percobaan :
* Sign in di blogger
* Klik menu Layout * Klik menu Edit HTML

Ingat ! jangan memberi tanda centang pada kotak
kecil di samping tulisan Expand Widget Template, sekali lagi jangan
mencentangnya, karena jika sobat mencentangnya nanti akan keluar kode-kode
widget yang memusingkan kepala.

Cari kode seperti di bawah ini (lebih gampangnya tekan Crtl+F ketik "header-wraper") secara otomatis pencari menunjukkan tempat keberadaan code yang anda cari:

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
ganti nilai 660px dengan 840px ,900px juga boleh, sehingga kodenya jadi seperti ini :


#header-wrapper {
width:840px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
§ Cari kode seperti di bawah ini :
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}br>
ganti nilai 660px menjadi 840px, sehingga kodenya menjadi seperti ini :
#outer-wrapper {
width: 840px;
margin:0 auto;
padding:10px;text-align:left;
font: $bodyfont;
}

Cari kode seperti di bawah ini :
#sidebar-wrapper {
width: 220px;
float: right;
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 */
}
Copy paste kode berikut persis di bawah kode yang seperti di atas :
#sidebarbaru-wrapper {

width: 180px;
float: right;
psdding-left:10px;
word-wrap: break-word;
overflow: hidden;
}

Cari kode seperti di bawah ini :
#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}
Ganti nilai 660px menjadi 840 px, sehingga kodenya akan seperti ini :

#footer {
width:840px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}
Cari kode seperti di bawah ini :

<div id='sidebar-wrapper'><br /> <b:section class='sidebar' id='sidebar' preferred='yes'><br /><b:widget id='Profile1' locked='false' title='Mengenai 'type='Profile'/><br /><b:widget id='BlogArchive1' locked='false' title='Arsip' type='BlogArchive'/><br /></b:section><br /> </div>

Copy kode berikut, lalu paste persis di bawah kode yang seperti di atas :

<div id='sidebarbaru-wrapper'><br /><b:section class='sidebar' id='sidebarbaru' preferred='yes'/></b:section><br /></div>
* Klik tombol Simpan Template

* Selesai.
Untuk melihat efek hasilnya, silahkan klik Elemen Halaman apakah sudah
berformasi tiga kolom atau belum? jika sudah, silahkan isi sidebar tersebut
dengan apa saja lalu lihatlah hasil nyatanya.

Langkah-langkah di atas merupakan metoda dasar saja, untuk menambahkan variasi
lain, sobat memerlukan pengetahuan serta kretifitas.

Posted in: Blog Tutorial