cara membuat dua kolom tambahan di atas dan di bawah postingan

MENAMBAH DUA KOLOM DIATAS DAN DI BAWAH POSTINGAN BLOG

gambar menambah 2 kolom baru

Pada kesempatan kali ini saya akan memberikan petunjuk bagaimana cara membuat kolom tambahan pada bagian atas dan bagian bawah postingan blog, biasanya jika kita mengguanakan tample bawaan dari blog, ada kalanya, diatas postingan blog tidak ada klom tambahan, kalaupun adanya, biasanya hanya satu kolom aja, pada tutorial kali ini saya akan membahas cara membuat dua kolom diatas dan di bawah postingan.
Cara kerjanya sebagai berikut

1. Login ke blogger
2. Masuk ke Rancangan dan klik Edit HTML
3. Cari kode ]]></b:skin> dengan menggunakan tombol f3 pada keyboard
3. Letakan kode dibawah ini diatas kode ]]></b:skin>
kode tersebut adalah...

/*Dua Kolom di Posting by blogtrikdantips

-----------------------------*/

#underpost h2{

font-size:13px;

font-weight:bold;

color:#B8002E;

border-bottom:2px solid #000000;

padding-left:5px;

}

#underpost{

width:530px;

}

#underleft{

width:257px; /*lebar kolom kiri*/

float:left;

margin:4px;

}

#underright{

width:250px; /*lebar kolom kanan*/

float:right;

margin:4px;

}

Keterangan
1.Kode yang berwarna Hitam  adalah lebar kedua kolom tersebut sedangkan
2. kode berwarna hijau adalah lebar salah satu kolom.
Tinggal diedit dan disesuaikan dengan lebar kolom posting anda.


MENAMBAHKAN DUA KOLOM DI BAWAH POSTINGAN
             Jika ingin menambahkan dua kolom dibawah posting maka tambah code yang berwarna merah tepat dibawah code yang berwarna biru dan masih didalam code yang berwarna hijau diatas.


<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 id='underpost'>
<b:section class='underleft' id='underleft'/>
<b:section class='underright' id='underright'/>
</div>

</div>

MENAMBAHKAN DUA KOLOM DIATAS POSTINGAN

           jika ingin menambah dua kolom diatas posting maka taruh code yang berwarna merah diatas code yang berwarna biru dan didalam code yang berwarna hijau

<div id='main-wrapper'>

<div id='underpost'>

<b:section class='underleft' id='underleft'/>

<b:section class='underright' id='underright'/>

</div>

<b:section class='main' id='main' showaddelement='no'>

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

</b:section>

</div>

Terakhir save dan lihat hasilnya