Pada postingan kali ini mengenai cara menambah 1 kolom dibawah sidebar blog dan yang satu lagi cara menambah 2 kolom dibawah sidebar blog. Penambahan elemen / kolom baru di sidebar ini berguna untuk meletakkan widget yang menurut anda penting dan menarik. Ya udah langsung saja pada topik pembahasan cara menambah 1 kolom baru dibawah sidebar dan menambah 2 kolom dibawah sidebar blog.
Membuat 1 elemen baru dibawah sidebar
1. Login ke blogger
2. Pada dasbor, pilih Template => Edit HTML
3. Tekan Ctrl+F, lalu cari kode yang mirip dibawah ini, biasanya ada diatas
]]></b:skin>
#sidebar-wrapper{width:350px;float:right;word-wrap:break-word;overflow:hidden}
4. Tambahkan kode ini dan letakkan dibawahnya
#bottom-col{width:350px;float:right;word-wrap:break-word;overflow:hidden}
Penerapannya seperti dibawah ini :
#sidebar-wrapper{width:350px;float:right;word-wrap:break-word;overflow:hidden}
#bottom-col{width:350px;float:right;word-wrap:break-word;overflow:hidden}
5. Cari kode seperti dibawah ini :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML4' locked='false' title='' type='HTML'/>
</b:section>
</div>
6. Letakkan kode berikut dibawah kode </b:section>
<b:section class='sidebar' id='bottom-col' preferred='yes'>
7. Penerapannya seperti dibawah ini :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML4' locked='false' title='' type='HTML'/>
</b:section>
<b:section class='sidebar' id='bottom-col' preferred='yes'>
</div>
8. Kalau dilihat di Tata Letak seperti ini
Membuat 2 elemen baru dibawah sidebar
1. Login ke blogger
2. Pada dasbor, pilih Template => Edit HTML
3. Tekan Ctrl+F, lalu cari kode yang mirip dibawah ini, biasanya ada diatas
]]></b:skin>#sidebar-wrapper{width:350px;float:right;word-wrap:break-word;overflow:hidden}
4. Tambahkan kode ini dan letakkan dibawahnya
#left-col{width:170px;float:left;word-wrap:break-word;overflow:hidden}
#right-col{width:170px;float:right;word-wrap:break-word;overflow:hidden}
Penerapannya seperti dibawah ini :
#sidebar-wrapper{width:350px;float:right;word-wrap:break-word;overflow:hidden}
#left-col{width:170px;float:left;word-wrap:break-word;overflow:hidden}
#right-col{width:170px;float:right;word-wrap:break-word;overflow:hidden}
5. Cari kode seperti dibawah ini :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML4' locked='false' title='' type='HTML'/>
</b:section>
</div>
6. Letakkan kode berikut dibawah kode </b:section>
<b:section class='sidebar' id='left-col' preferred='yes'>
<b:section class='sidebar' id='right-col' preferred='yes'>
7. Penerapannya seperti dibawah ini :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML4' locked='false' title='' type='HTML'/>
</b:section>
<b:section class='sidebar' id='left-col' preferred='yes'>
<b:section class='sidebar' id='right-col' preferred='yes'>
</div>
8. Kalau dilihat di Tata Letak seperti ini
Nah demikianlah Cara Menambah 1 Kolom, 2 Kolom dibawah Sidebar Blog, semoga bermanfaat, happy blogging
