Cara Menambah 3 Kolom Footer Pada Template

Sebagian template blogger tentu memiliki keunikan tersendiri. Seperti pada jumlah kolomnya. ada yang dua, tiga, sampai empat kolom. Pertanyaanya, apakah template tersebut terdapat kolom 'tambah gadget' di bagian footer? Jika tidak, disinilah saya coba berbagi tips cara menambah 3 kolom footer pada template. Mungkin saja tutorial ini bermanfaat untuk sobat yang mau memasang/menambah elemen tiga kolom footer pada template blog milik sobat.

Sebelumnya, pastikan template blog sobat belum memiliki elemen tambah gadget di bagian footer alias hanya 2 atau 3 kolom sidebar saja.

Dan langkah untuk menambah 3 kolom footer pada template, sebagai berikut:

1. Login ke blogger. Setelah masuk klik rancangan lalu klik edit html.

2. Backup/simpan terlebih dahulu template yang sedang digunakan dengan mengklik link download template lengkap. Ini untuk mengantisipasi jika nanti terjadi kesalahan dalam pengeditan template.

3. Setelah selesai, beri centang pada kotak kecil disamping expand template widget.

4. Selanjutnya cari kode:

<div id='footer'>

5. Setelah ketemu, tepat diatas kode tersebut paste/masukan kode seperti dibawah ini:

<div id='bottom'>
<b:section class='bottom' id='bottom_1' preferred='yes'/>
<b:section class='bottom' id='bottom_2' preferred='yes'/>
<b:section class='bottom' id='bottom_3' preferred='yes'/>
</div>

6. Setelah selesai, cari lagi kode:

]]></b:skin>

7. Dan tepat diatas kode tersebut (no.6) masukan kode CSS berikut ini:

#bottom{width:900px;position:relative;clear:both;margin:0px auto 0px;color:#000000;float:left;background:#f7f7f7;padding:15px;margin:0px}
#bottom h2{color:#333;font-size: 14px;font-family: Arial, Tahoma, Verdana;font-weight: bold;margin-top:5px;line-height:1.4em;letter-spacing:0em;text-transform:capitalize;border-bottom:1px solid #ccc;}
#bottom ul{padding:0px;margin:0px;}
#bottom ul li{line-height:26px;list-style-type:square;border-bottom:1px solid #fff;}
#bottom_1{width:260px;float:left;margin-left:20px;padding:0px;}
#bottom_2{width:260px;float:left;margin-right:35px;padding:0px;}
#bottom_3{width:260px;float:left;margin-left:35px;padding:0px;}

Perhatikan pada kode width:900px sesuaikan dengan lebar header pada template sobat. Belum tahu ukurannya? (baca: cari tahu lebar header). Sedangkan pada kode 260px adalah lebar dari tiap kolom footernya yang berjumlah tiga. Angka 260pxini didapat dari 900px dikurangi 120px (total jumlah margin dan padding) = 780px lalu dibagi 3 = 260px.

8. Setelah beres, Langkah terakhir klik simpan template.

Jika berhasil, Lihat hasilnya dibagian rancangan. Otomatis ada link baru tambah gadget di bagian footer alias bawah, yang berjumlah 3 kolom footer.

Selamat mencoba!