Blog Ini akan membantu anda untuk menemukan informasi seputar internet komputer dan lain lain

Tuesday, July 24, 2012

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 Rating: 4.5 Diposkan Oleh: Ramdoni

1 comments:

sobat blog ini dofollow,,,sobat berkomentarlah walaupun sepatah kata
Komenlah Dengan Nama dan Blog Sobat Sendiri
Komentar Sobat sangat bermanfaat untuk perkembangan blog ini. Terima Kasih!!!

Exit Jangan Lupa Klik Like/Suka