Kolom halaman dalam sebuah blog merupakan elemen penting yang berguna untuk menambahkan berbagai widget
kedalam blog kita. Namun kadang template yang kita miliki kurang sesuai
dengan apa yang kita inginkan. Ada kalanya kita ingin menambahkan widget
di bagian tertentu tapi tidak tersedia kolom untuk itu. Jika
demikian, tentu kita harus menambahkan kolom baru kedalam template blog
tersebut.
Cara untuk menambahkan kolom baru tersebut sebenarnya tidak terlalu sulit. Kita tinggal menambahkan kode CSS kedalam template blog kita lalu memberikan perintah HTML pada body template tersebut. Berikut adalah langkah-langkah yang harus kamu lakukan:
Cara untuk menambahkan kolom baru tersebut sebenarnya tidak terlalu sulit. Kita tinggal menambahkan kode CSS kedalam template blog kita lalu memberikan perintah HTML pada body template tersebut. Berikut adalah langkah-langkah yang harus kamu lakukan:
Login ke blogger.
Pilih dasbor klik Elemen Halaman dan pilih Edit HTML.
Lakukan duplikasi template untuk berjaga-jaga jika terjadi masalah.
cari dengan menekan CTRL+F ]]></b:skin>
Pastekan kode berikut di ]]></b:skin>
/* Tambahan Dua Kolom */
#tambah {
width:300px;
height:auto;
position: relative;
float: right;
margin: 5px 0 0 0;
padding: 0px;
font-size: 12px Arial, Helvetica, sans-serif;
}
#kiri {
width: 150px;
float: left;
padding: 0 5px 0 5px;
}
#kanan {
width: 130px;
float: right;
padding: 0 5px 0 5px;
}
Pada perintah tersebut, kolom ditempatkan di sebelah kanan dengan
margin atas 5px (putaran jarum jam: atas, kanan, bawah, kiri) dan lebar kolom
300px, yang terbagi untuk kolom kiri 150px dan kanan 130px.
Masing-masing kolom memiliki jarak dalam kolom (padding) kiri dan kanan 5px. Kamu
dapat membuatnya sesuai dengan ukuran dan posisi yang kamu inginkan.
Tapi jangan lupa, jika ukuran kolom utama 300px maka ukuran kolom-kolom
lain ditambah margin kiri dan kanan tidak boleh melebihi 300px.
Setelah itu cari </body>
dan pastekan kode berikut diatas </body>
<div id='tambah'>
<b:section class='tambah' id='kiri' showaddelement='yes'>
</b:section>
<b:section class='tambah' id='kanan' showaddelement='yes'>
</b:section>
</div>
Save Tamplate