5/14/2012

Cara Membagi Elemen Gadget Menjadi Dua Kolom

Cara Membagi Elemen Widget Menjadi Dua Kolom Pada Sidebar Di Blog - Pada kesempatan ini, saya akan membahas lagi cara membagi gadget menjadi dua kolom. Maksudnya disini, kita akan mengubah satu tempat gadget yang biasanya ditempati oleh satu gadget, jadi bisa ditempati dua gadget dalam satu tempat. Biar ndak bingung, coba saja lihat gambar dibawah :
Jika ditempati, akan menjadi :
Ikuti langkah berikut sob :

1. Login ke Blogger
2. Klik Rancangan >> Edit HTML
3. Paste-kan kode berikut tepat sebelum kode ]]></b:skin>
#kolom-kiri {
width: 49%;
float: left;
}
#kolom-kanan {
width: 49%;
float: right;
}
Nb :
Setelah bagian ini, biasanya banyak blogger yang kesulitan untuk mencari kode atau menempati ditempat yang sesuai, jadi kalian harus bersabar menerima cobaan selanjutnya ! :)

4. Cari kode berikut
<div id='sidebar-wrapper'>

  <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Label99' locked='false' title='Labels' type='Label'/>
  </b:section>

  </div>
Nb :
Kode diatas mungkin tidak semua blogger memiliki id yang sama, tetapi coba saja cari kode yang mirip dengan kode diatas

5. Sekarang sisipkan kode berikut diantara kode yang sudah saya tebalkan tadi
<b:section class='sidebar' id='kolom-kiri' showaddelement='yes'>
<b:widget id='Label1' locked='false' title='Kategori' type='Label'/>
</b:section>

<b:section class='sidebar' id='kolom-kanan' showaddelement='yes'>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
</b:section>

<div style='clear: both;'/&gt
6. Jika sudah save templatenya !
7. Lalu lihat pada elemen laman, jika belum sesuai dengan permintaan sobat, coba sisipkan pada kode yang lain

Nb:
Kode yang ada pada template saya
<div id='sidebar-top'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML8' locked='false' title='' type='HTML'/>
<b:widget id='CustomSearch1' locked='false' title='Search' type='CustomSearch'/>
<b:widget id='PopularPosts1' locked='false' title='Yang Sering Di Baca' type='PopularPosts'/>
<b:widget id='HTML9' locked='false' title='Informasi' type='HTML'/>
<b:widget id='Stats1' locked='false' title='Stat' type='Stats'/>
<b:widget id='HTML3' locked='false' title='Artikel Terbaru' type='HTML'/>
<b:widget id='Profile1' locked='false' title='Mengenai Saya' type='Profile'/>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>

</b:section>

<b:section class='sidebar' id='kolom-kiri' showaddelement='yes'>
<b:widget id='Label1' locked='false' title='Kategori' type='Label'/>
</b:section>

<b:section class='sidebar' id='kolom-kanan' showaddelement='yes'>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
</b:section>

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

</div>
Kode yang berwarna merah adalah kode yang disisipkan tadi

Enjoy To Blog !
 

Pertanyaan Terkait Cara Membagi Elemen Gadget Menjadi Dua Kolom

Berlangganan

Suka dengan Jawaban di atas? Silakan berlangganan gratis via email

Tidak puas dengan jawaban ini?, silahkan tambahkan Jawaban alternatif lain yang lebih tepat.