Tambah 2 Kolom Di Atas dan Di Bawah Postingan

Bagaimana cara membuat atau menambahkan 2 kolom di bawah atau di atas postingan ? Pada template default blogger, kolom di bawah atau di atas postingan tidak tersedia, namun dengan menerapkan kode berikut kita bisa menambahkan kolom yang kita inginkan tersebut. Untuk fungsinya anda dapat menggunakannya sebagai kolom iklan agar mudah dilihat pengunjung. Berikut ini,

Cara Menambah Dua Kolom Elemen di Atas atau di Bawah Widget Post

1. Login ke akun Blogger anda, pilih menu Template lalu klik Edit HTML (untuk antisipasi sebaiknya Backup Template lengkap).
2. Cari kode ]]></b:skin> ,untuk memudahkan pencarian tekan "Ctrl + F" pada keyboard.
3. Letakkan Code CSS di bawah ini di atas kode ]]></b:skin>

    /*Under Post
    -----------------------------*/
    #underpost h2{
    font-size:13px;
    font-weight:bold;
    color:#B8002E;
    border-bottom:2px solid #000000;
    padding-left:5px;
    }
    #underpost{
    width:590px;
    }
    #underleft{
    width:275px; /*lebar kolom kiri*/
    float:left;
    margin:4px;
    }
    #underright{
    width:275px; /*lebar kolom kanan*/
    float:right;
    margin:4px;
    }

Kode warna merah anda sesuaikan dengan lebar (nilai width) post body atau main-wrapper anda,
Kode warna biru nilai hasil bagi dua dari lebar  post body atau main-wrapper, dan dikurangi dengan nilai margin dan padding untuk jarak tepi antara kolom kiri dan kanan.
Kemudian cari kode berikut :

<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>

Untuk menambahkan dua kolom di bawah postingan, copy dan letakkan kode berikut di bawah kode warna biru, beberapa template mungkin kodenya ada yang panjang, yang perlu diperhatikan kode penutup </b:section>

<div id='underpost'>
<b:section class='underleft' id='underleft'/>
<b:section class='underright' id='underright'/>
</div>

Sedangkan untuk menambahkan dua kolom di atas postingan, copy kode warna merah di atas kemudian letakkan di atas kode yang berwarna biru.
Singkatnya, untuk penempatan kodenya seperti di bawah ini,

<div id='main-wrapper'>
(Dua kolom di atas postingan, letakkan kodenya di sini)
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
(Dua kolom di bawah postingan, letakkan kodenya di sini)
</div>

Save template dan masuk ke Tata letak, anda akan melihat dua kolom tambahan pada area atas/bawah post widget.

Beri Kami +1 Agar Terus Semangat Menulis Untuk Anda :

Title : Tambah 2 Kolom Di Atas dan Di Bawah Postingan
Hati-Hati Jika ingin Copy-Paste (15 Blog Sudah TERHAPUS Akibat DMCA Takedown)..!
Pastikan Menyertakan Link Aktif Dofollow Dengan URL :
http://odyckdnero.blogspot.com/2011/12/tambah-2-kolom-di-atas-dan-di-bawah.html

Related Post