Menambah 2 Kolom Dibawah Postingan

Menambah 2 Kolom Dibawah Postingan ini merupakan panduan blogger yang memaksimalkan halaman postingan blog. Dengan menambah 2 kolom dibawah postingan kita dapat memaksimalkan serta mengisi ruang kosong dan menambahka widget yang kita inginkan. Banyak para blogger yang sudah menggunakan teknik ini, dan biasanya mereka menambahkan widget artikel terkait dan juga kotak berlangganan email.

Sebenarnya banyak manfaat ketika kita menggunakan teknik ini, diantaranya tidak menjejali sidebar blog yang berpengaruh dengan kecepatan loading blog. Hal ini sering diabaikan oleh para blogger yang  keasikkan untuk mempercantik blog dengan widget-widget yang notabanenya tidak telalu penting. Untuk itu jika anda tertarik untuk memaksimalkan halaman postingan blog Anda dengan menambah 2kolom dibawah postingan, perhatikan tutorial berikut ini.

1. Login ke akun blogger Anda

2. Kemudian klik rancangan

3. Klik Edit HTML

4. Untuk berjaga-jaga dan mencegah hal-hal yang tidak diinginkan jika terjadi kesalahan, download terlebih dahulu template anda.

5. Beri centang/ceklis pada kotak Expand Template Widget

6. Lanjutkan dengan mencari kode ]]></b:skin> (gunakan ctrl + f untuk mempermudah pencarian)

7. Jika sudah dapat, sisipkan kode berikut diatas kode ]]></b:skin>

.bawahpost {{margin:5px 0px 10px 0px;padding:5px 0;clear:both;}}
.bawahkiri {float:left;width:305px;margin-right:5px;border: 1px solid #EFF0F1; padding: 5px; background: #ffffff;-moz-border-radius:5px;}
.bawahkanan {float:right;width:305px;border: 1px solid #EFF0F1; padding: 5px; background: #ffffff;-moz-border-radius:5px;}

Rekomendasi : Agar ukuran kode CSS menjadi lebih kecil, saya merekomendasikan dan menyarankan kepada Anda untuk mengkompres kode css diatas. Hal ini dilakukan untuk menghindari lambatnya loading blog yang anda miliki. Anda dapat menguunakan CSS compressor tool yang telah saya sediakan dan sangat mudah dalam penggunaannya.

8. Lalu lanjutkan dengan mencari kode <data:post.body/> jika Anda telah menggunakan fungsireadmore, kode tersebut ada 2, kemudian

9. Masukkan kode berikut ini dibawah kode <data:post.body/> yang kedua/yang terakhir

<b:if cond='data:blog.pageType == "item"'>
<div class='bawahpost'>
<div class='bawahkiri'>

Kode Widget atau tulisan anda ada di sebelah kiri disini

</div>
<div class='bawahkanan'>

Kode Widget atau tulisan anda ada di sebelah kanan disini

</div>
</div>
</b:if>

Untuk tulisan yang berwarna merah, silahkan Anda hapus dan ganti dengan kode widget yang Anda inginkan kemudian sesuikan width: 305px (lebar kotak) dengan keinginan Anda.

10. Save

Semoga tips n trick ini bermanfaat bagi sobat !

Thanks for reading & sharing Kumpulan Artikel