This Beautiful Life

Merubah template 2 kolom menjadi 3 kolom - Buat temen - temen yang sudah mempunyai blog dengan 2 kolom, tapi ingin menambahkan kolom menjadi 3, silahkan dicoba cara berikut ini :

1. Login ke akun blogger agan.


2. Klik Template > Klik Edit HTML.

3. Untuk berjaga-jaga sebaiknya agan mendownload template terdahulu agar bila terjadi kesalahan bisa membackupnya kembali > Klik Download Template Lengkap.

4. Cari kode yang mirip seperti berikut karena setiap template berbeda-beda htmlnya. #outer-wrapper (tekan Ctrl+F untuk lebih mudah mencarinya)
--------------------------------
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
--------------------------------
5. Silahkan agan ganti angka yang berwarna biru 660 menjadi 950.

6. Selanjutnya sobat cari kode yang mirip seperti di bawah ini. #sidebar-wrapper (tekan Ctrl+F untuk lebih mudah mencarinya)
--------------------------------
#sidebar-wrapper {
width: 220px;
float: $enSide;
word-wrap: break-word;
/* fix for long text text breaking sidebar float in IE */
overflow: hidden;
/* fix for long non-text content breaking IE sidebar float
*/
}
--------------------------------
7. Silahkan agan ganti angka yang berwarna biru 220 menjadi 250.

8. Selanjutnya copy kode dibawah ini dan pastekan di bawah kode (Kode No.6)
--------------------------------
#second-sidebar-wrapper {
width: 250px;
float: $startSide;
word-wrap: break-word;
/* fix for long text text breaking sidebar float in IE */
overflow: hidden;
/* fix for long non-text content breaking IE sidebar float
*/
}
--------------------------------

Sehingga kodenya menjadi seperti ini :

--------------------------------
#sidebar-wrapper {
width: 250px;
float: $enSide;
word-wrap: break-word;
/* fix for long text text breaking sidebar float in IE */
overflow: hidden;
/* fix for long non-text content breaking IE sidebar float
*/
}

#second-sidebar-wrapper {
width: 250px;
float: $startSide;
word-wrap: break-word;
/* fix for long text text breaking sidebar float in IE */
overflow: hidden;
/* fix for long non-text content breaking IE sidebar float
*/
}
--------------------------------

9. Kemudian cari kode dibawah ini.
--------------------------------
<div id="'main-wrapper'">
<b:section class="'main'" id="'main" showaddelement="'no'">
<b:widget id="'Blog1'" locked="'true" title="'Blog" type="'Blog'/">
</b:widget>
</b:section></div>
<div id="'sidebar-wrapper'">
<b:section class="'sidebar'" id="'sidebar'" preferred="'yes'">
<b:widget id="Profile2" locked="false" title="About Me" type="Profile">
<b:widget id="BlogArchive2" locked="false" title="blog Archive" type="BlogArchive2">
<b:widget id="followers2" locked="false" title="Followers" type="Followers">
</b:widget>
</b:widget></b:widget></b:section></div>
--------------------------------

Copy kode dibawah ini tepat dibawahnya :
--------------------------------
<div id='second-sidebar-wrapper'>
<b:section class='sidebar' id='second-sidebar' preferred='yes'/>
</div>
--------------------------------

Sehingga kodenya menjadi seperti ini :
--------------------------------
<div id="'main-wrapper'">
<b:section class="'main'" id="'main" showaddelement="'no'">
<b:widget id="'Blog1'" locked="'true" title="'Blog" type="'Blog'/">
</b:widget>
</b:section></div>
<div id="'sidebar-wrapper'">
<b:section class="'sidebar'" id="'sidebar'" preferred="'yes'">
<b:widget id="Profile2" locked="false" title="About Me" type="Profile">
<b:widget id="BlogArchive2" locked="false" title="blog Archive" type="BlogArchive2">
<b:widget id="followers2" locked="false" title="Followers" type="Followers">
</b:widget>
</b:widget></b:widget></b:section></div>

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

10. Simpan Template.

Semoga Sukses..