Cara Menambahkan 1, 2, 3 Kolom Baru di Bawah Header atau di Atas Postingan Blog

Menambahkan 1, 2, 3 Kolom dibawah Header atau di Atas Postingan Blog

Secara default template blogger yang tersedia di blogger terdiri dari satu elemen widget yang berada di atas postingan atau di bawah judul Blog. Posisi widget di atas postingan blog yang menguntungkan jikalau dipasang iklan semacam AdSense. Letaknya yang stratrgis eksklusif dilihat dikala pertama kali membuka blog, memungkinkan mendapat klik banyak.

Naum jikalau Anda ingin memasang iklan lebih dari satu di atas postingan maka harus menambahkan 2 atau 3 kolom elemen widget. Berikut ini cara menambahkan 1, 2, 3 kolom baru di atas postingan blog :

1. Menambah 1 Kolom Dibawah Header atau di Atas Postingan Blog :

1. Login ke akun bloger anda

2. Pada dashboard, pilih Templates

3. Pilih Edit HTML

4. Centang Expand Widget Template

5. Tekan F3, cari isyarat ]]></b:skin> dan letakkan isyarat berikut diatasnya :

#siji-kolom {margin:10px 0;padding:1%;width:100%;}

6. Selanjutnya cari kode HTML ini :

<div id='header-wrapper'>

<b:section class='header' id='header' maxwidget="1" showaddelement="no">

<b:widget id='Header1' locked='true' title='test (Header)' type='Header'/>

</b:section>

</div>

7. Lalu letakkan isyarat berikut dibawahnya :

<div id="siji-kolom">

<b:section class='header' id='gawesijikolom' preferred='yes'/>

</div>

8. Simpan template.

2. Menambah 2 Kolom Dibawah Header atau di Atas Postingan Blog

1. Cari HTML ]]></b:skin> dan letakkan isyarat berikut diatasnya :

#loro-kolom {clear:both;}.gawe-loro-kolom {}

2. Selanjutnya cari HTML <div id='main-wrapper'> dan letakkan isyarat berikut diatasnya :

<div id='loro-kolom'>

<div id='kolom1' style='width: 50%; float: left; margin:0; text-align: left;'>

<b:section class='gawe-loro-kolom' id='kolom1' preferred='yes' style='float:left;'/></div>

<div id='kolom2' style='width: 50%; float: right; margin:0; text-align: left;'>

<b:section class='gawe-loro-kolom' id='kolom2' preferred='yes' style='float:right;'/></div>

<div style='clear:both;'/></div> 

3. Simpan template.

3. Menambah 3 Kolom Dibawah Header atau di Atas Postingan Blog

1. Cari HTML ]]></b:skin> dan letakkan isyarat berikut diatasnya :

#tellu-kolom {clear:both;}.gawe-tellu-kolom {}

2. Selanjutnya cari HTML <div id='main-wrapper'> dan letakkan isyarat berikut diatasnya :

<div id='tellu-kolom'>

<div id='kolom1' style='width: 35%; float: left; margin:0; text-align: left;'>

<b:section class='gawe-tellu-kolom' id='kolom1' preferred='yes' style='float:left;'/>

</div>

<div id='kolom2' style='width: 30%; float: center; margin:0; text-align: left;'>

<b:section class='gawe-tellu-kolom' id='kolom2' preferred='yes' style='float:center;'/>

</div>

<div id='kolom3' style='width: 35%; float: right; margin:0; text-align: left;'>

<b:section class='gawe-tellu-kolom' id='kolom3' preferred='yes' style='float:right;'/>

</div>

<div style='clear:both;'/>

</div> 

3. Simpan dan lihat hasilnya.