Breaking News
Loading...

Cara Membuat Footer Menjadi 3 Kolom

07.13

Sobat semua pakabar semua...lama gak posting artikel kali ini saya akan posting,tah apa yang akan saya postigngkan nanti semoga bermanfaat buat sobat semua,mohon maaf sobat semua saya jarang update artikel di blog ni karena masih utak atik js blog ini, agar menyengkan di lihat indra pembaca tentunya,,,maklumlah aku hanyalah orang bodoh yang ingin bisa bukan ingin pandai, okelah sobat langsung saja ke TKP,,,saya mau kasih cara membuat footer menjadi 3 kolom, gimana sih cara membuatnya... langsung aja silahkan sobat simak langkah-langkah di bawah ini :

Cara Membuat Footer Menjadi 3 kolom

1.Login ke blogger.

2.Klik Tata Letak.

3.Klik Edit HTML.

4.Cari kode ]]></b:skin> .Biar lebih gampang carinya silakan sobat tekan tombol CTRL+F .

5.Selanjutnya copy dan paste kode berikut tepat di atas kode ]]></b:skin> .

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

6.Selanjutnya Cari kode dibawah ini .

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

7.Jikalau sudah ketemu Hapus kode <b:section class='footer' id='footer'/> kemudian ganti bengan kode dibawah ini .

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

<div id='footer1' 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='footer2' 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='footer3' 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>

8.Klik Simpan Template .

9.Jika sudah selesai maka hasilnya akan terlihat seperti gambar di bawah ini .


SELAMAT MENCOBA SOBAT SEMOGA BERHASIL

2 komentar:

  1. kok g bisa ya gan?
    yg step 6, g ada di html template ku...gimana gan?

    BalasHapus
  2. wah sip bro....... mntab..... cocok buat template baru gw.... visit ya http://vikrymadz.blogspot.com

    BalasHapus

Terima kasih sudah mau berkunjung ke Blog sederhana ini, Tidak ada salahnya untuk memberikan komentar untuk kemajuan blog ini.
Catatan komentar yang tidak ditampilkan :
1. Komentar SPAM
2. Komentar tidak bermutu / tidak nyambung.
3. Memasukan Link ke dalam kotak komentar blog.

 
Toggle Footer