Membuat Footer Menjadi 3 Kolom

Membuat Footer Menjadi 3 Kolom - Terkadang para sobat Blogger semua tidak begitu memperdulikan Footer Blog karena letaknya di Paling bawah pada halaman blog, tetapi kalau untuk saya Footer itu cukup berguna, karena saya dapat menaruh widget yang tidak begitu dibutuhkan pengunjung tetapi cukup berguna buat saya seperti Visitors,Social Bookmark,dll.
Tentunya pengunjung pun akan terasa lebih nyaman jika sedang mengunjungi blog kita.

Disini saya akan memberikan Trik Belajar Blog membuat footer 3 kolom,dan sangat mudah pula mempraktekannya.
OK langsung aja ..

Ket : Trik ini khusus untuk blogger beta (layout)

1. Login ke Blog
2. Klik Rancangan - Edit HTML
3. Centang “Expand Widget Template”

4. Copy Script di bawah 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>

5. Cara letakannya Cari script di bawah
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

Ganti yang berwarna merah dengan script di Point 4 tadi.

6. Save Template

Selesai ..... Sekarang anda sudah mempunyai Footer 3 Kolom di blog anda,semoga trik ini dapat bermanfaat.
Taruhlah widget2 yang dapat bermanfaat bagi blog dan pengunjung anda.
 

2 komentar:

Anonim mengatakan...

thanks gan ilmu nya ....

Dika mengatakan...

Ok sama2 sob

Posting Komentar

 
Copyright © 2011 Andhika Hutomo Blogdhika.com. Powered by Blogger™