Cari Artikel Blog Ini

Total Tayangan Laman

MENGUBAH BAGIAN FOOTER MENJADI TIGA KOLOM

Kolom template pada bagian footer (bagian bawah, umumnya hanya memiliki satu kolom. Akan lebih menarik jika kolom tersebut kita bagi menjadi tiga bagian.
Template EPG Studio memiliki lebar kolom keseluruhan adalah 1100px atau 1100 pixel. Jadi tips kali ini berpanduan pada lebar kolom template EPG Studio. Bagi anda yang memiliki lebar template yang berbeda dengan EPG Studio dapat anda lakukan perubahan pada angka-angka yang ditampilkan nantinya.
Sebelum menambah 3 kolom pada bagian footer, sebaiknya anda lihat dulu berapa lebar keseluruhan kolom template anda (lihat pada bagian outer wrapper). Katakanlah lebarnya 1100px. Jadi dalam penambahan 3 kolom template tersebut, anda harus berpatokan pada lebar outer wrapper tadi.
Setelah mengotak atik angka tadi sehingga pas untuk template anda, kita masuk pada langkah-langkahnya.
  1. Masuk ke Blogger.
  2. Pilih Rancangan bagian Edit HTML.
  3. Kasih tanda cek pada Expand Template Widget.
  4. Cari kode ]]></b:skin> , kemudian copy kode dibawah ini dan letakkan tepat diatasnya.

    #footer-column-container {
    clear:both;
    }
    .footer-column {
    position:relative;
    clear:both;
    float:center;
    padding:10px 0 10px 0;
    }


  5. Cari kode dibawah ini pada bagian </body> .


    <b:section class='footer' id='footer'>




  6. Ganti kode diatas dengan kode dibawah ini

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



  7. Klik Simpan Template
  8. Selesai. Sekarang anda tinggal mencoba kolom yang baru dibuat tersebut. Tambahkan sesuatu pada blog anda (gambar atau tulisan)

Selamat mencoba, semoga bermanfaat..!!

Jika artikel ini bermanfaat..? Bagikan lewat :


BACA JUGA ARTIKEL DIBAWAH INI



Comments
17 Comments

17 komentar :

Rosyid Hanif Fauzi mengatakan...

trimakasih artikelnya

Muslihun Al-lampani mengatakan...

Trima Kasih kang.........

bliyan mengatakan...

wah, saya coba dulu ya kang! thx infonya.

Brain Revolution mengatakan...

sampeyan dadi wong kok apik temen mas, maturnuwun ya

fredy mengatakan...

mari kita coba...
hehehe...
nice blogging

KANG_TATANG mengatakan...

makasih atas tips-tips nya yg ada di blog Akang. Sukses selalu ah ...

hannif mengatakan...

Pak sebelumnya makasih atas semua infonya... Tapi saya mau nanya kalau mengganti seperti postsRSS,commentRSS,atau edit pada blog standard di atasanya teh,,menjadi seperti yang kaya bapak banyak gitu... Ada profilnya,free download, ayah bunda, itu gmn?? Saya mau menggantinya dengan memasukan blog lain pada blog saya.... Tolong pak minta balasannya lewat email saya di rafaelhannif.vdv93@yahoo.co.id makasih pak sebelumnya.... Kunjungi blog saya di www.hannif.co.cc

obat stress mengatakan...

AKU cuma bisa bilang....makasih...hebat...salut.....aku bisa belajar banyak...salah satu blog sahabat paling sering aku buka.

ipank mengatakan...

terima kasih infonya... mas
salam kenal


ipank

Aneuk Nanggroe mengatakan...

Numpang baca sekalian mau di tes akh..

MUBAROK mengatakan...

Sudah mas tapi ketimpa ma sidebar footer jadinya kalo pasang widget terselip di bawahnya sidebar footer, gimana ya

akatsuki mengatakan...

maksih tip nya

Celebrities mengatakan...

Mas, maaf saya ngeganggu nih!, kan saya sudah menitik ilmu dari mas, alhamdulillah saya bisa, dan sedikit lagi mas kalo bisa mas tolongin saya, cara ngebuatin scrollnya pada footer jadi tiga kolom biar kagak terlalu memanjang kebawah, gimana ya mas, saya mohon bantuan sedikit lagi,terima kasih sebelum sahabatku, semoga makin sukses dan sehat2 selalu bersama keluarga..

donny montang mengatakan...

makasih bang

NUANSA UMROH mengatakan...

mantap gan copy paste

Indra mengatakan...

sip infonya Gan.....

Capung mengatakan...

Bs di coba nih :D

Posting Komentar

Ceritakan keberhasilan/kegagalan anda setelah mencoba Tutorial Blogger pada kotak komentar. Kritik dan Saran juga boleh asal sifatnya membangun...!!!