Cara Membuat Footer 3 Kolom

Beberapa Template Yang Anda Download, Tidak Semuanya Menyediakan Kolom Footer. Dan Fungsi Footer Cukup Banyak.. Nah, kali Ini saya akan Memposting Cara Membuat Footer dengan Jumlah Kolom 3.

1.  Masuk pada akun blogger Anda
2. Pilih Rancangan >> Edit HTML
3. Untuk berjaga-jaga Download Template Lengkap Terlebih Dahulu
4. Centang Expand Template Widget
5. Cari :
   

   ]]></b:skin>

6. Copy kode berikut dan tempatkan tepat diatas kode ]]></b:skin>
   

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

7. Cari kode berikut yang sama atau hampir sama dengan kode berikut :
   Pencarian 1 :
   

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

   Jika tidak ketemu ganti pencarian menjadi :
   Pencarian 2 :
   

   <!-- end outer-wrapper -->

   atau pencarian 3 :
   

   <div id='footer'>

8. Jika yang kode pencarian yang ada pada blog :
   • Jika yang Anda temukan adalah kode Pencarian 1 maka :
     Ganti kode <b:section class='footer' id='footer'/> dengan kode dibawah ini.
   • Jika pencarian 2 atau 3 yang Anda temukan tempatkan kode dibawah initepat diatas kode tersebut.

   <div id='footer-column-divide'>
   <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;'/>
   </div>

9. Lalu Simpan. Dan Lihat Hasilnya.

Selamat Mencoba & Happy Blogging.


Sumber : http://www.katakan-hey.com

Cara Membuat Footer 3 Kolom 9 Out Of 10 Based On 10 Ratings. 9 User Reviews.

Share 'Cara Membuat Footer 3 Kolom' On ...

Anda baru saja membaca artikel yang berkategori Tutorial dengan judul Cara Membuat Footer 3 Kolom. Anda bisa bookmark halaman ini dengan URL http://arya96.blogspot.com/2012/05/cara-membuat-footer-3-kolom.html. Terima kasih!

Ditulis oleh: Arya Dharma - Jumat, 11 Mei 2012