Latest Movies :

Membuat footer 3 kolom dibawah posting

Membuat footer 3 kolom dibawah posting >>Footer 3 kolom yang DEWATA maksud adalah kolom yang berada dibawah,jadi jika kamu pengen meletakkan widget anda yang pasti footer ini akan sangat berguna juga,okey langsung aja ke topik pengetesan >-->>.....Footer wraper dari template klasik hanya mempunyai satu widget, begitu pula template - template minima hasil design para master web.

Bagi anda yang ingin mengganti footer - nya menjadi 3,4,atau 5 kolom, anda bisa menggati kodenya dengan kode dibawah ini,caranya :

>>>login ke blog anda
>>>Klik Tata Letak
>>>Edit Html
>>>Cari kode #footer-wrapper atau yang mirip seperti itu, kalo sudah ketemu hapus kode tersebut dan ganti dengan kode dibawah ini:






/* ----- FOOTER ----- */

#footer-wrapper {
clear: both;width: 100%;
word-wrap: break-word;
overflow: hidden;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
background: #0000FF;
border: 1px solid $bordercolor;
}
#footer {
margin: 0px 0px 0px 0px;
padding: 0px 0px 10px 0px;
text-align: left;width: 960px;
color: #000000;
font: $footerTextFont;
line-height: 1.6em;
}
#footer h2 {
margin: 10px 0px 0px 0px;
padding: 3px 0px 3px 0px;
color: #cc0000;
font: $footerTextFont;
}
#footer1 {width:320px;float:left;background:#FFFFFF; padding: 0px;border: 1px solid #cccccc;}
#footer2 {width:320px;float:right;background:#FFFFFF; padding: 0px;border: 1px solid #cccccc;}
#footer3 {width:320px;float:left;background:#FFFFFF; padding: 0px;border: 1px solid #cccccc;}
#footer1 .widget-content {margin:0 .5em 0 ;}
#footer2 .widget-content {margin:0 .5em 0 ;}
#footer3 .widget-content {margin:0 .5em 0 ;}
#footer a { color: #3D81EE; text-decoration: none; }
#footer a:hover { color: #cc0000; text-decoration: none; }
#footer a:visited { color: #3D81EE; text-decoration: none;}





>>Kemudian cari kode yang mirip dengan kode diwah ini:

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

>>>setalah menemukan code diatas selanjutnya ganti dengan code dibawah ini:

<div id='footer-wrapper'>
<div id='footer'>

<b:section class='footer' id='footer1' preferred='yes'>
</b:section>


<b:section class='footer' id='footer2' preferred='yes'>
</b:section>

<b:section class='footer' id='footer3' preferred='yes'>
</b:section>

</div>
<div style='clear:both;'/>
</div><!-- end footer-wrapper -->

>>>Simpan template
>>>Selesai,Kode di atas untuk membuat footer 3 kolom

NB:agar sesui pada blog anda sebaiknya anda ukur dulu lebar pada blog kamu, sesuaikan juga warna pada kode css seperti yang anda inginkan, lihat blog saya ini ini juga hasil otakatik aja seperti tutorial ini bagus gak,,he he he...
semoga bermanfaat.


Judul: Membuat footer 3 kolom dibawah posting; Ditulis oleh Unknown; Rating Blog: 5 dari 5

Tidak Ada Komentar Pada Artikel » Membuat footer 3 kolom dibawah posting

Posting Komentar

Dharla Ferdana
Support : Dharla Ferdana | Blogs Post | Angka Matot
Copyright © 2013. Dark Paper - All Rights Reserved
Template Created by Creating Website Redesign by Dharla Ferdana
Proudly powered by Blogger