Menambah Satu kolom dibawah Dua Kolom sidebar.
Template blog tiga kolom (3 coloum) banyak digunakan sobat blogger karena lebih bagus tampilannya dan bisa memasang banyak gadget (Widget) sekaligus,Tentu ini lebih muat banyak konten seperti widget sekaligus dari pada memakai template 2 kolom. Template 3 kolom biasanya tampilannya lebih lebar (pas di layar) dengan susunan kiri kolom posting, kanan sidebar 1 kolom dan bawah sidebar 2 kolom, berikut ini contoh tampilan atau layout template 3 kolom sebagai berikut:
Entah karena ingin menjadikan tampilan blognya berbeda atau karena ingin memasang banyak gadget(widget), kadang sobat ingin menambahkan 1 kolom di bawah 2 kolom sidebar untuk memasang widget seperti widget shoutmix, follower, dll agar lebih lebar hasilnya. Lalu bagaimana membuat 1 kolom lagi dibawah 2 kolom sidebar?coba lihat gambar berikut ini setelah ditambah 1 kolom dibawah sidebar :
Mau tau cara nambahin 1 kolom lagi, silahkan ikuti langkah berikut:
*Sebelumnya, pastikan dulu kalo template blognya adalah 3 kolom seperti gambar pertama:
1. Login ke blogger
2. Setelah masuk dasbor klik "Tata Letak"
3. Pilih "Edit HTML" , lalu download dulu template lama dan simpan dikomputer
4. Centang "Expand Template Widget"
5. Cari kode ]]></b:skin> lalu paste kode dibawah ini persis diatas kode ]]></b:skin> tadi
/*-- (Sidebar) --*/
#sidebar-right{float:right; width:405px; height:100%; min-height:100%; padding:0px} #sidebar-right .widget{padding:2px; margin-bottom:0px; border:1px; background-color:#fff}6. Setelah itu, cari kode berikut:
</div>
<!-- end sidebar wrapper -->
<div style='clear: both;'/>
</div><!-- end contentwrapper -->
*Mungkin ditemplate lain berbeda namanya tapi intinya sama, yaitu akhir dari sidebar (end sidebar wrapper) , Sobat bisa cari kode yang mirip dengan kode tersebut.Setelah ketemu, copy paste kode berikut ini persis diatas kode warna biru tadi :
<div id='sidebar-right'>
<b:section class='sidebar' id='sidebar22' preferred='yes'/>
</div>
7. Sehingga menjadi seperti ini:
<div id='sidebar-right'>
<b:section class='sidebar' id='sidebar22' preferred='yes'/>
</div>
</div>
<!-- end sidebar wrapper -->
<div style='clear: both;'/>
</div><!-- end contentwrapper -->
8. Terakhir simpan, dan lihat perubahan "Tata Letak" atau Layout template.Hasilnya seperti gambar ini setelah ditambahkan Shoutmix lebar di bawah sidebar:
Selamat mencoba
Sumber
Template blog tiga kolom (3 coloum) banyak digunakan sobat blogger karena lebih bagus tampilannya dan bisa memasang banyak gadget (Widget) sekaligus,Tentu ini lebih muat banyak konten seperti widget sekaligus dari pada memakai template 2 kolom. Template 3 kolom biasanya tampilannya lebih lebar (pas di layar) dengan susunan kiri kolom posting, kanan sidebar 1 kolom dan bawah sidebar 2 kolom, berikut ini contoh tampilan atau layout template 3 kolom sebagai berikut:
Entah karena ingin menjadikan tampilan blognya berbeda atau karena ingin memasang banyak gadget(widget), kadang sobat ingin menambahkan 1 kolom di bawah 2 kolom sidebar untuk memasang widget seperti widget shoutmix, follower, dll agar lebih lebar hasilnya. Lalu bagaimana membuat 1 kolom lagi dibawah 2 kolom sidebar?coba lihat gambar berikut ini setelah ditambah 1 kolom dibawah sidebar :
Mau tau cara nambahin 1 kolom lagi, silahkan ikuti langkah berikut:
*Sebelumnya, pastikan dulu kalo template blognya adalah 3 kolom seperti gambar pertama:
1. Login ke blogger
2. Setelah masuk dasbor klik "Tata Letak"
3. Pilih "Edit HTML" , lalu download dulu template lama dan simpan dikomputer
4. Centang "Expand Template Widget"
5. Cari kode ]]></b:skin> lalu paste kode dibawah ini persis diatas kode ]]></b:skin> tadi
/*-- (Sidebar) --*/
#sidebar-right{float:right; width:405px; height:100%; min-height:100%; padding:0px} #sidebar-right .widget{padding:2px; margin-bottom:0px; border:1px; background-color:#fff}
</div>
<!-- end sidebar wrapper -->
<div style='clear: both;'/>
</div><!-- end contentwrapper -->
*Mungkin ditemplate lain berbeda namanya tapi intinya sama, yaitu akhir dari sidebar (end sidebar wrapper) , Sobat bisa cari kode yang mirip dengan kode tersebut.
<div id='sidebar-right'>
<b:section class='sidebar' id='sidebar22' preferred='yes'/>
</div>
<div id='sidebar-right'>
<b:section class='sidebar' id='sidebar22' preferred='yes'/>
</div>
</div>
<!-- end sidebar wrapper -->
<div style='clear: both;'/>
</div><!-- end contentwrapper -->
Selamat mencoba
Sumber
0 komentar:
Posting Komentar