Tuesday, March 5, 2013

Cara Membuat 2 Kolom Footer Di Blog



Sebelumnya saya sudah membahas cara membuat footer 3 kolom di blog, dan sekarang saya akan membahas cara membuat 2 kolom footer di blog.

Untuk cara membuatnya silahkan ikuti langkah-langkah sebagai berikut:

1. Login ke blogger
2. Pilih blog > Template > Edit HTML > Centang Expand Template ( Sebelum Pengeditan ini disarankan untuk mem backup template di Cadangan / Pemulihan)
3. Jika sudah, Cari kode ]]></b:skin> (Gunakan CTRL + F untuk mempermudah pencarian).
4. Kemudian tambahkan semua kode berikut diatas atau sebelum kode ]]></b:skin>

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


5. Selanjutnya, Cari salah satu kode berikut di bawah ini. (Gunakan CTRL + F kembali untuk mempercepat pencarian). Cari salah satu kode saja.


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

ATAU


<div id='footer'>
<b:section class='footer' id='footer' showaddelement='yes'/></div>


6. Jika sudah ketemu kodenya, tambahkan kode dibawah atau sesudah kode <b:section class='footer' id='footer' showaddelement='yes'/> atau <b:section class='footer' id='footer' />


<div id='footer-column-divide'>

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

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

<div style='clear:both;'/>
</div>


7. Klik Preview atau Pratinjau, bila tidak ada yang eror silahkan save dan lihat hasilnya.





Cara Membuat 2 Kolom Footer Di Blog, Membuat 2 Kolom Footer Di Blog, Tutorial Membuat 2 Kolom Footer Di Blog, How to Make 2 Column Footer In Blog, Make 2 Column Footer In Blog, Tutorials Make 2 Column Footer In Blog

No comments:

Post a Comment