Cara Menambahkan gadget 2 kolom Di Bawah Sidebar

Bagi sobat yang merasa tidak puas dengan jumlah kolom sidebar yang hanya satu kolom saja, dan sobat menginginkan agar terdapat 2 kolom dibawahnya. Tentu sobat bisa membuatnya, semua itu dapat dilakukan dengan mudah. Yuk langsung kita simak.

Screenshot sebelum di edit : 

Cara Membuat 2 Kolom dibawah Sidebar
1. Login ke blogger
2. Masuk ke Rancangan >> Edit HTML
3. [Sebagai contoh] Cari kode CSS seperti dibawah ini :

#sidebar-wrapper {
float:left;
width:320px;
padding:5px;
margin:0;
}

4. Agar sesuai dengan contoh diatas. Tambahkan kode berikut di bawahnya.

#sidebar-kiri {
width:160px;
float:left;
padding:5px;
margin:0;
}

#sidebar-kanan {
width:160px;
float:right;
padding:5px;
margin:0;
}

Sehingga hasilnya akan seperti ini :

#sidebar-wrapper {
float:left;
width:320px; /* ini contoh lebar kolom sidebar */
padding:5px;
margin:0;
}

#sidebar-kiri {
width:160px; /* sesuaikan dg setengah ukuran lebar sidebar template anda*/
float:left;
padding:5px;
margin:0px;
}

#sidebar-kanan {
width:160px; /* sesuaikan dg setengah ukuran lebar sidebar template anda */
float:right;
padding:5px;
margin:0px;
}

5. Kemudian cari kode seperti dibawah ini :

<div id='sidebar-wrapper'>
      <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML1' locked='false' title='BUKU TAMU' type='HTML'/>
<b:widget id='HTML2' locked='false' title='DAFTAR ISI' type='HTML'/>
<b:widget id='HTML3' locked='false' title='SPONSOR' type='HTML'/>
</b:section>
   </div>

6. Tambahkan kode berikut di atas </div>

<b:section class='sidebar' id='sidebar-kiri' preferred='yes'/>
<b:section class='sidebar' id='sidebar-kanan' preferred='yes'/>

Sehingga hasilnya akan seperti ini :

<div id='sidebar-wrapper'>
      <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML1' locked='false' title='BUKU TAMU' type='HTML'/>
<b:widget id='HTML2' locked='false' title='DAFTAR ISI' type='HTML'/>
<b:widget id='HTML3' locked='false' title='SPONSOR' type='HTML'/>
</b:section>
<b:section class='sidebar' id='sidebar-kiri' preferred='yes'/>
<b:section class='sidebar' id='sidebar-kanan' preferred='yes'/>
   </div>

7. Simpan template sobat.
Sekarang menuju ke Rancangan/Tata Letak. bila berhasil, maka akan muncul 2 kolom dibawah sidebar yang tadinya hanya ada 1 kolom sidebar saja.  
Seperti Screenshot dibawah ini :

Selamat mencoba. Semoga sukses dan bermanfaat.http

Cara Menambahkan gadget 2 kolom Di Bawah Sidebar 2012-07-24T21:36:00-07:00 Rating: 4.5 Diposkan Oleh: Unknown