Menambah Kolom Elemen Di Bawah 2 Sidebar

kemarin saya posting menambah 2 kolom elemen di bawah sidebar   tutorial sekarang saya akan mencoba menambahkan dibawah 2 sidebar kita buat kolom sidebar baru, caranya cukup sederhana karena ini akan mengotak-atik template anda makanya sebaiknya download terlebih dahulu template anda

Elemen Dibawah 2 Sidebar

Mari kita mulai tutorial menambah kolom elemen dibawah 2 sidebar

1.Seperti biasa Log in dulu ke blogger
2.Tata letak
3.Edit HTML
4.Backup template anda, klik Download Template Lengkap
5.Beri tanda centang pada kotak kecil kanan atas
6.Sekarang cari kode ini

 #sidebar-wrapper {

width: 301px;

float: right;
word-wrap: break-word;
/* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#left-col{
width:150px;
float:left; 
word-wrap:break-word;
overflow:hidden;
}
#right-col {
width:150px;
float:right;
word-wrap:break-word;
overflow:hidden;
}


yang  berwarna biru  adalah lebar dari sidebar dan yang berwarna merah adalah properti dari sidebar
ini tergantung pada template anda karena lebar dan floath berbeda-beda setiap blog . jadi cari yang mendekati di atas
#sidebar-wraper ( adalah kolom sidebar yang paling atas )
#left-col dan #right-col (adalah kolom kiri dan kanan yang di bawah sidebar utama)

untuk menambah satu kolom lagi di bawah 2 kolom kiri kanan di atas tinggal tambahkan kode berikut ini

#bottom-col {

width:320px; 

float:right;

word-wrap:break-word; 

overflow:hidden; 

} 

sehingga menjadi seperti ini

#sidebar-wrapper {
width: 301px;
float: right;
word-wrap:
break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
#left-col {
width:150px;
float:left;
word-wrap:break-word;
overflow:hidden;
}
#right-col {
 width:150px;
float:right;
word-wrap:break-word;
overflow:hidden;
}
#bottom-col { 

width:301px; 

float:right; 

word-wrap:break-word; 

overflow:hidden;

}

sekarang cari kode seperti ini

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
<b:widget id= dan seterusnya...
<b:section class='sidebar' id='left-col' preferred='yes'/>
<b:section class='sidebar' id='right-col' preferred='yes'/>
</div>

Tambahkan Kode ini :

 

<b:section class='sidebar' id='bottom-col' preferred='yes'/>

sehingga menjadi seperti ini

 <div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
<b:widget id= dan seterusnya...
<b:section class='sidebar' id='left-col' preferred='yes'/>
<b:section class='sidebar' id='right-col' preferred='yes'/>
</div>

<b:section class='sidebar' id='bottom-col' preferred='yes'/> 

Simpan hasil menambah kolom elemen di bawah 2 sidebar , dan lihat hasil nya.