Cara menambah tiga kolom di bagian footer

Posted on

Tutorial ini saya ambil dari T4 Belajar Blogger,yang menurut saya sangat menarik.dan saya akan repost di blog ini.Simpel saja,jika melihat gambar berikut pasti langsung akan mengerti apa fungsi dari nambag 3 kolom di footer ini.Berikut gambarnya

 

Sudah paham?jika belum,liat lagi tuh gambarnya.hehe..jika sudah,yuk kita lanjut.

Ada beberapa langkah untuk membuat tiga kolom di bagian footer ini,langkah-langkahnya sebagai berikut:

1.Login ke akun blogger anda
2.Klik Rancangan tuju ke => Edit HTML
3.Sebelumnya centang kotak expand template widget dulu ya
4. Lalu cari kode ]]></b:skin>, dan letakkan kode berikut ini di atas kode  ]]></b:skin>

 #footer-column-container {
clear:both;
}
.footer-column {
padding: 10px;
}

5.Lalu cari kode seperti berikut


6.Lalu letakkan kode berikut dibawah kode no.5 tadi

<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>





 Selesai.semoga berhasil

sumber:http://t4belajarblogger.blogspot.com/2009/11/cara-menambah-tiga-kolom-di-bagian.html

            http://justforfun-adrianrivald.blogspot.com/2011/04/cara-menambah-tiga-kolom di-bagian.html#ixzz1KpcquV4J

Gravatar Image
Suka jalan-jalan, naik sepeda, bermain code-code asal tidak suka mengkode cinta. Hubungi email : andhika.na@gmail.com jika anda butuh website untuk personal maupun bisnis.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.