Minima Stretch 3 Columns Blogger Template

Berikut ini adalah cara mengedit template Minima Stretch yang disediakan oleh blogger.com untuk blog kita agar menjadi Minima Stretch 3 Columns Blogger Template.

1. Pertama, pastikan bahwa template yang sedang anda gunakan adalah Minima Stretch, seperti gambar di bawah ini:

2. Setelah SEKIAN LAMA AKU MENUNGGU itu, beralihlah ke Template->Edit HTML dan ikuti langkah KAKI langkah berikut untuk mengedit Template Minima anda menjadi Minima Stretch 3 Columns Blogger Template

3. Buatlah ruangan CLASS baru untuk kolom tambahan yang akan anda buat dengan cara mengurangi ukuran #main-wrapper dengan ukuran kolom baru yang akan anda buat (67%-25%=42%). Cari #main-wrapper dan ubahlah nilai width / lebar menjadi 42% seperti yang bisa anda lihat di bawah ini:

#main-wrapper {
margin-left: 2%;
width: 42%;
float: left;
display: inline;       /* fix for doubling margin in IE */
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 */
}

4. Kemudian buatlah #sidebarLeft-wrapper dengan meng copy paste kode di bawah:

#sidebar-wrapper {
margin-right: 2%;
width: 25%;
float: right;
display: inline;       /* fix for doubling margin in IE */
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 */
}

#sidebarLeft-wrapper {
margin-left: 2%;
width: 25%;
float: left;
display: inline;       /* fix for doubling margin in IE */
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 */
}

5. Dan langkah KAKI yang terakhir adalah dengan cara menambahkan sidebar kiri untuk mengaktifkan kolom ke 3 dengan cara meng-copy kode yang bercetak tebal berikut ini dan paste sebelum

<div id='main-wrapper'>

<div id='sidebarLeft-wrapper'>
  <b:section class='sidebar' id='sidebarLeft' preferred='yes'>
  </b:section>
</div>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
</b:section>
</div>

6. Setelah itu Save dan sekarang beralihlah ke Design >> Page Elements dimana sekarang anda bisa menambahkan widget atau gadget HTML yang baru:

Selamat!!! Sekarang tempalte minima stretch anda sudah menjadi Minima Stretch 3 Columns Blogger Template

http://www.compender.com/2007/12/minima-stretch-to-three-column-template.html