How to Make 4 Columns On Footer Blogspot

Membuat 4 Kolom Di Atas Footer. Bulan lalu ada yang riquest pada kang salman mengenai cara pembuatan 4 kolom di footer blog. Sebelumnya kang salman pernah membahas bagaimana cara membuat 3 kolom di bawah footer disini, namun karena ada spesial riquest kang salman posting tutorialnya di blog. Oiya orang pertama yang menanyakan ini pada kang salman adalah Deden Budiman selanjutnya diteruskan oleh beberapa pengguna situs kucoba.com yang meminta agar tutorial ini di publikasikan ke umum.

Untuk membuat menjadi 4 kolom, perlu di lakukan sedikit penyesuaian, dengan manambah footer-wrapter

1. Login ke blogger
2. Pilih Rangangan
3. Pilih Edit HTML
4. Silakan copy kode di bawah ini dan simpan di atas ]]></b:skin>:

/* bottom
---------------------------- */ #bottom {
width: 870px; /*sesuaikan dengan lebar blog*/
position: relative;
clear:both;
margin: 0 auto;
color:#fff;
float: left;
background:#BDBABD;
padding: 15px 0 15px 0;
}
#bottom h2 {
padding: 5px 0 2px 0;
margin: 0 0 10px 0;
color:#ff5a00;
font-size: 24px;
letter-spacing: -1px;
border-bottom: 1px solid #fff;
}
#bottom ul {
padding: 0;
margin: 0;
}
#bottom ul li {
line-height: 26px;
list-style-type: none;
border-bottom: 1px dashed #031c5d;
}
#bottom ul li a {
display: block;
padding: 0 10px;
color:#0701FD;
text-decoration: none;
}
#bottom ul li a:hover {
background: #B1ACB1;
}
#left-bottom { /* yang ini nih kode kolom kiri */
width: 205px;
float: left;
padding-left:10px;
}
#center-bottom { /* kalo yg ini kode kolom tengah */
width: 205px;
float: left;
padding-left:10px;
}
#right-bottom { /* kalo yg ini kode kolom kanan */
width: 205px;
float: left;
padding: 0 5px 0 10px;
}
#right-pojok-bottom { /* kalo yg ini kode kolom kanan */
width: 205px;
float: left;
padding: 0 5px 0 10px;
}

5. lihat bagian </body> yaitu pada bagian bawah kode template, dan cari kode yang mirip seperti ini :

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

6. Copy paste kode berikut persis di atas kode yang atas tadi :

<div id='bottom'> <b:section class='bottom' id='left-bottom'/>
<b:section class='bottom' id='center-bottom'/>
<b:section class='bottom' id='right-bottom'/>
<b:section class='bottom' id='right-pojok-bottom'/>
</div>

7. Jangan lupa akhiri dengan mengklik tombol Simpan Template.

Mudah sekali bukan? silakan Anda modifikasi sendiri bentuknya, dan warnanya sehingga cocok dengan template blog Anda.

Demikian semoga bermanfaat dan selamat Membuat 4 Kolom Di Atas Footer.


Jangan asl copy paste! baca aturannya disini
Post By Kang Salman
www.kucoba.com

Ingin mendapat penghasilan tambahan? Cara kerja mudah hanya dengan melakukan survey dan mengisi angket lalu anda akan di bayar. Itulah pekerjaan anda disini <= klik untuk daftar dan memanen uang $ seperti saya. Gratis

Dapatkan update artikel  terbaru kami langsung ke email anda.