Cara Menambah 2 Kolom Dibawah Postingan Blog

Wednesday, December 5, 20120 comments

Cara Menambah 2 Kolom Dibawah Postingan Blog - Met sore sobat techno semua, dah lama gak online dan ngisi blog.

Disore yang mendung dan dikit gerimis ini, ts pengen share gimana sih nambah 2 kolom dibawah postingan blog? (kaya diwebnya detik.com misalnya).

oke...langsung aja sobat techno semua, yang harus kita lakukan pertama adalah :

1. Login ke akun blogger sobat techno semua.

2. Terus sobat klik rancangan.

3. Terus sobat Klik Edit HTML.

4. Nah untuk berjaga-jaga dan mencegah hal-hal yang tidak diinginkan sobat techno jika terjadi kesalahan, download terlebih dahulu template sobat semua.

5. Kasih centang/ceklis pada kotak Expand Template Widget.

6. Terus lanjutkan dengan mencari kode ]]></b:skin> (gunakan ctrl + f untuk mempermudah dan mempercepat 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:300px;margin-right:5px;border: 1px solid #EFF0F1; padding: 5px; background: #ffffff;-moz-border-radius:5px;}
.bawahkanan {float:right;width:300px;border: 1px solid #EFF0F1; padding: 5px; background: #ffffff;-moz-border-radius:5px;}


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

8. Lalu lanjutkan dengan mencari kode <data:post.body/>, kemudian

9. Masukkan kode berikut ini dibawah kode <data:post.body/> yang kedua atau yang terakhir
<b:if cond='data:blog.pageType == "item"'> <div class='bawahpost'> <div class='bawahkiri'> Masukkan Kode Widget atau tulisan sobat techno disini </div> <div class='bawahkanan'> Masukkan Kode Widget atau tulisan sobat techno disini </div> </div> </b:if>


10. Terus klik tombol save / simpan template.

kode diatas bisa di modifikasi sesuai dengan keinginan sobat techno semua.

oke...selamat mencoba dan jangan lupa lihat hasilnya.

Share this article :
 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. view technology - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger