Cara Membuat Footer 3 Kolom Dengan Background

Diposting oleh Unknown on Rabu, 15 Agustus 2012

Pada tips Mepercantik Blog kali ini saya akan menjelaskan Cara Membuat Footer 3 Kolom Dengan Background, karena tidak semua template mempunyai footer 3 kolom ini, tetapi tidak usah khawatir karena disini kita akan membuatnya.

 Ini adalah screen shot gambar template punya saya sebelum membuat footer 3 kolom

 


 Gambar template ini sesudah saya membuat footer 3 kolom

 


Tertarikah sobat semua untuk dapat membuatnya? Baik saya akan memulai langkah-langkahnya

  1. Login ke blogger dan masuk ke Dasbor.
  2. Klik Rancangan, lalu pilih menu Edit HTML (Jangan Centang "Expand Template Widget")
  3. Cari kode ]]></b:skin>
  4. Letakkan kode CSS berikut ini diatas ]]></b:skin>


#footer-column-container {
clear:both;
}
.footer-column {
background:#444 url(http://i1237.photobucket.com/albums/ff473/muhammadsuteja/footerbawah.jpg) no-repeat; width:900px; position:relative; clear:both; margin:0 auto; float:left; padding:5px 0 10px 0; color:#fff
}


Catatan : Untuk warna backround silahkan ganti http://i1237.photobucket.com/albums/ff473/muhammadsuteja/footerbawah.jpg ini dengan gambar yang di inginkan.

5.Cari Kode <!-- end content-wrapper --> dan letakkan kode dibawah ini tepat diatasnya

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

 
6.Simpan Template

Sekian artikel Cara Membuat Footer 3 Kolom Dengan Background dapat saya jelaskan, selamat mencoba

Ditulis Oleh : Unknown ~ Turitorial Blog

Anda sedang membaca sebuah artikel yang berjudul Cara Membuat Footer 3 Kolom Dengan Background. Terimakasih atas kunjungannya dan semoga artikel ini dapat bermanfa'at.

:: Thank you for visiting ! ::

Comments
0 Comments

{ 0 komentar... read them below or add one }

:) :( ;) :D ;;-) :-/ :x :P :-* =(( :-O X( :7 B-) :-S #:-S 7:) :(( :)) :| /:) =)) O:-) :-B =; :-c :)] ~X( :-h :-t 8-7 I-) 8-| L-) :-a :-$ [-( :O) 8-} 2:-P (:| =P~ :-? #-o =D7 :-SS @-) :^o :-w 7:P 2):) X_X :!! \m/ :-q :-bd ^#(^ :ar!

Bagaimana Pendapat Sobat Semua Tentang Artikel Di Atas???

Untuk menambahkan yahoo emotion pada komentar sobat adalah dengan cara menyertakan kode yahoo emotion diatas pada komentar yang sedang ditulis contohnya kode seperti ini :) yang terdapat di atas kotak komentar ini

Panduan Memberi Komentar
1.Masukan komentar anda
2.Lalu pada kata 'beri komentar sebagai' , pilih account yang anda punya, bagi yang belum mempunyai account pilih Name/url, isi nama anda dan Kosongkan URL atau isi dengan alamat facebook anda(untuk mengetahui alamat facebook anda silahkan login ke facebook dan pilih profile anda, anda dapat melihat alamat Facebook anda di atas, contoh alamat Facebook punya saya http://www.facebook.com/profile.php?id=1823916177
3.dan kemudian Publikasikan
4.Selesai dan anda tinggal menunggu komentar anda muncul
Semoga bermanfa'at.

 
^ Back to Top