Cara Merubah Template 2 kolom menjadi 3 kolom
Setiap template di Blogger mungkin memiliki kolom berbeda-beda tergantung jenis template yang digunakan. Namun jika seseorang sudah 'jatuh hati' pada satu template, dan kolom yang tersedia di template tersebut tidak sesuai keinginan. Kadang butuh beberapa racikan agar kolom template tersebut bisa di desain sesuai kebutuhan penggunanya.
Berikut ini ada cara untuk merubah template 2 kolom menjadi 3 kolom. Bagaimana cara merubahnya?
Cara Merubah Template 2 kolom menjadi 3 kolom:
- Login ke akun Blogger
- Pilih Template >> Edit HTML
- Cari kode yang mirip dengan kode seperti ini karena setiap template berbeda-beda kode htmlnya #outer wrapper (gunakan ctrl F agar lebih mudah mencarinya)
- Kemudian cari kode yang mirip seperti ini:
#sidebar-wrapper (gunakan ctrl+F untuk lebih mudah mencarinya) - Lalu copy-paste script berikut ini di bawah kode no 4 di atas:
- Selanjutnya cari kode yang mirip dengan kode berikut ini:
<div id="'main-wrapper'"> (gunakan ctrl+F untuk lebih mudah mencarinya) - Simpan Template. Cek Tata Letak apakah kolomnya sudah bertambah atau belum.
-----------------------------------Ganti angka yang berwarna Biru menjadi 950
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
-----------------------------------
--------------------------------Ganti angka yang berwarna Biru menjadi 250
#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
*/
}
--------------------------------
--------------------------------
#sidebarbaru-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
*/
}
--------------------------------
--------------------------------Copy-paste kode berikut ini tepat dibawahnya :
<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='sidebarbaru-wrapper'>
<b:section class='sidebar' id='sidebarbaru' preferred='yes'/>
</div>
--------------------------------
Join the conversation