Rabu, 26 September 2012

Cara Membuat 3 Kolom Footer di Blog

Rasanya Sepi aja ya bro jika tidak gadget pelengkap di footer, ya biar lebih kelihatan mantap dan berjejer aja bro seperti blog gua ini bro, untuk itu mari bro kita lihat untaian berikut ya bro :






1. Login Pada Blog lo bro >> klik Tata Letak >> Edit HTML >> Centang Expand Template Widget ya bro, untuk 
    antisipasi kesalahan bro, lebih baik lo BACKUP dulu data lo bro ok.

2. Carilah bro kode ]]></b:skin> jika sudah dapat bro, letakkan kode berikut diAtas Kode
      ]]></b:skin> ya bro :


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




3. Carilah Bro Kode berikut yg mungkin ada di blog lo bro :


  1.         <div id='footer-wrapper'>
    <b:section class='footer' id='footer'/>
    </div>
  2. <!-- end outer-wrapper -->
  3. <div id='footer'>

   Keterangan Cara Pakai Kode Bro :
  •           Jika yang lo temukan bro adalah Kode 1 bro maka :
    Ganti kode <b:section class='footer' id='footer'/> dengan kode dibawah ini ya bro :   
     
  •           Jika Kode 2 dan Kode 3, tinggal letakkan Kode diBawah bro diAtasnya ok :


<div id='footer-column-divide'>
<div id='footer1' style='width: 33%; float:left;
margin:0; text-align:left;'>
<b:section class='footer-column' id='Raxter1'
preferred='yes' style='float:left;'/>
</div>

<div id='footer2' style='width: 34%; float: left;
margin:0; text-align: left;'>
<b:section class='footer-column' id='Raxter2'
preferred='yes' style='float:center;'/>
</div>

<div id='footer3 style='width: 33%; float: right;
margin:0; text-align: left;'>
<b:section class='footer-column' id='Raxter3'
preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>
</div>



4. Tinggal Simpan template deh bro dan lihat hasilnya. 


Gampangkan bro, jika lo ingin 4 kolom footer, 5 kolom footer atau berapunpun bro, silahkan request aja ya bro . . .


 Selamat mencoba ya bro.

2 komentar:

  1. @Ahmad Zaki Purba : Coba diletakkan bro dibawahnya Kode yg Ke 2. . . gua bisa bantu bro tapi gua mana tau script Html blog lo kayak mana . . . ini tips normal bro, tips extrim-nya susah dijelasin . . . sesuai yg gua praktekin bro memang begitulah caranya . . .

    BalasHapus