5.09.2010

Menambah Footer Template Blog

Mungkin diantara sobat semua ada yang bingung atau tidak puas dengan layout template blog yang sobat punya sekarang karena tidak mempunyai tempat buat nyimpen widget ataupun iklan di footernya, atau mungkin footer blog yang sobat punya hanya 1 kolom? Jangan khawatir…-weiss bahasanya- ;-p

Sebernya tidak terlalu sulit juga seh tapi juga jangan dianggap mudah, karena segala sesuatu kalo dianggap enteng pasti hasilnya akan mengecewakan, katanya seh….. :-)

Gak usah panjang lebar d, sekarang aBie mo ngasih caranya menambah footer blog kita menjadi 3 tiga kolom :

  1. Seperti biasa login ke account blogger sobat
  2. Kemudian klik “Expand Widget Template”
  3. Jangan lupa save dl template anda kalau-kalau terjadi kesalahan
  4. Kemudian temukan ini:


<div id='footer-wrapper'>

<b:section class='footer' id='footer'/>

</div>



5. Ganti kode yang berwarna merah 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>



6. Save template sobat.

Nah sekarang footer template blog sobat uda jadi 3 kolom. Kalo gk percaya liat aja di “page element” & liat bagian footernya, pasti ada 3 kolom.

Semoga Bermanfaat.

Catatan : Jika proses penggantian kode yang berwarna merah gagal, kamu bisa coba untuk menambahkannya saja dan tidak mereplace apapun.



2 komentar:

muter2 dr maren akhirnya dpt juga ilmu ini :D
Thanks banget ya kk...

@Fillah Grunge : OK d... semoga bermanfaat.

Posting Komentar

Berikan Komentar Anda Tentang Postingan ini.

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites