Berikut Cara Membuat Dua Kolom Posting Homepage Blogspot
- Masuk ke akun blogger sobat
- Klik menu Template >> Edit Html >> tekan Ctrl+F pada keyboard sobat
- Cari Kode ]]></b:skin>
- Letakkan kode berikut dibawah kode ]]></b:skin>
<b:if cond='data:blog.pageType != "item"'>
<style>
.post {width:250px;height:400px;margin:0 20px 5px 0;overflow:hidden;float:left;}
</style>
</b:if>
Tambahan 1 :- Jika sobat ingin menambahkan background cukup memasang kodenya saja seperti berikut ini
.post {background:#00000;width:250px;height:400px;margin:0 20px 5px 0;overflow:hidden;float:left;} - Atur lebar dan tinggi postingan
width:250px;height:400px; - Atur jarak antar postingan
margin:0 20px 5px 0;
Tambahan 2 :
Jika di blog sobat terdapat Readmore, atur juga jumlah kata, lebar dan tinggi gambar yang terdapat didalam kode Readmore tersebut
Contoh:
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250; ← perkecil angka ini
summary_img = 250; ← perkecil angka ini
img_thumb_height = 200; ← perkecil angka ini
img_thumb_width = 200; ← perkecil angka ini
</script>
<script type='text/javascript'>
.............
</script> - Jika sobat ingin menambahkan background cukup memasang kodenya saja seperti berikut ini
- Selanjutnya cari kode .post {
Pasang auto diantara kode jarak dalam .post {
Sebelum
.post {margin:0.5em 0 1.5em;}
Sesudah
.post {margin:0.5em auto 0 1.5em;}
Penambahan auto ini sebenarnya hanya tambahan saja agar jarak antar artikel sesuai. Bisa sobat tambahkan, bisa juga tidak, namun untuk mengetahuinya apakah perlu menambahkan auto, silahkan preview blog terlebih dahulu dan bandingankan hasilnya antara ada dan tidak adanya auto - Setelah selesai. Preview blog sobat terlebih dahulu dan lihat hasilnya. Jika hasilnya seperti gambar berikut ini, dimana link Posting Lama terlihat seperti gambar berikut ini
Pada gambar diatas, link Posting Lama atau sejenisnya berada sejajar dengan artikel blog dan untuk mengembalikan ke posisi sebenarnya yaitu berada di bawah kanan, silahkan cari kode <b:include name='nextprev'/> dan tambahkan kode <div style='clear: both;'/> tepat diatas <b:include name='nextprev'/>
Hasilnya:
<div style='clear: both;'/>
<b:include name='nextprev'/> - Preview lagi blog sobat
- Selamat! Halaman depan atau homepage blog sobat sudah berubah menjadi dua kolom posting
Klik untuk melihat kode: :) =( :s :D :-D ^:D ^o^ 7:( :Q :p T_T @@, :-a :W *fck* x@