Menggunakan template 3 kolom, ternyata masih ada yang kurang. Seperti masih butuh space lagi gtu?? he..he.. maklum lagi seneng expansi dan coba hal-hal baru ney... Trus ada inspirasi dari melihat blog para master yang punya 3 kolom pada footer section nya, perasaan lega banget kalo ada 3 kolom itu. Ok langsung ke TKP aja ya!!! Tutorial ini saya ambil dari bloggerbuster, kalo mw langsung menuju kesana silahkan, tapi berbahasa inggris, he.. he.. buat yang alergi bahasa inggris 'don't step away!!!'

1. Login dulu ke blogspot kemudian setelah masuk langsung menuju Tata Letak > Edit HTML. Sebelum memulai merubah kode, template terlebih dahulu di save klik Download Template Lengkap simpan file di tempat yang aman.

2. Setelah itu cari kode seperti dibawah yang berwarna merah, jangan centang Expand Template Widget yaa, nanti keluar kode-kode yang memusingkan.

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

Asal tau saja neh tidak semuanya kode template kamu sama seperti di atas, bisa saja di sebut “footer-wrap” atau “footer”. Yang jelas di dalam Rounders templates, kamu perhatikan ada dua DIV section di sekitar footer section. Dalam hal ini kita hanya merubah kode yang berwarna merah saja.

3. Ganti kode yang berwarna merah tersebut dengan kode dibawah ini:

<div id='footer-column-container'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>

<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
<p>
<hr align='center' color='#5d5d54' width='90%'/></p>

<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>

4. Sekarang di save terlebih dahulu hasil pekerjakan kita, setelah selesai lanjutkan dengan mencari kode tag </b:skin>, setelah ketemu sisipkan kode di bawah sebelum kode tag </b:skin>.

#footer-column-container {
clear:both;
}

.footer-column {
padding: 10px;
}

Nah.. Selesai deh!!! Kita hanya tinggal save template, dan lihat hasilnya ke Tata Letak > Layout akan terlihat ada penambahan 3 kolom di footer. Bisa kamu sisipkan dengan widgets atau yang lainnya sesuai dengan keinginan kamu.
Just In Case aja neh, kalo mau coba feed dengan alamat berikut boleh2 aja, buat ngetes... coba buat elemen halaman pilih feed isikan alamat berikut:

1. http://indo-trans.blogspot.com/atom.xml
2. http://indo-trans.blogspot.com/feeds/comments/full
3. http://indo-trans.blogspot.com/rss.xml

Happy Blogging...

Baca Juga Artikel yang Berkaitan!!!