Cara Membuat Dua Kolom Postingan Di Beranda Blog
Cara Membuat Dua Kolom Postingan Di Beranda Blog. Pada artikel Jona Rendra ini, saya akan memberikan sebuah cara mengedit blog dengan membuat dua kolom postingan di beranda. Di buat 2 kolom supaya terlihat lebih elegan dan hemat tempat. Box box pada post di home page ini akan memberi kesan blog anda lebih profesional. Itu menurut saya. Coba saja lihat gambar dibawah ini yang sudah menerapkan Cara Membuat Dua Kolom Postingan Di Beranda Blog.
Gambar diatas adalah screenshot dari homepage blog Jona Rendra. Anda juga ingin membuat postingan anda dua kolom? Ikuti langkah langkah berikut ini.
Cara Membuat Dua Kolom Postingan Di Beranda Blog
1. Login ke akun blogger anda
2. Masuk ke template > edit HMTL > Lanjutkan > centang expand template widget
3. Cari kode
]]></b:skin>
, kemudian paste kode berikut ini dibawahnya<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>
4. Cari lagi kode <script type='text/javascript'>
yang mirip seperti kode dibawah ini:<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 200;
summary_img = 200;
img_thumb_height = 100;
img_thumb_width = 100;
</script>
5. Mungkin ada sedikit perbedaan pada angka diatas dengan HTML di template blog anda. Jika angkanya lebih besar daripada angka diatas, misalkan 300, 300, 250 dan 250, ganti dengan angka yang lebih kecil agar sesuai dengan lebar postingan pada setiap kolomnya.
Jika tidak disusutkan, readmore otomatis tersebut akan terpotong. Tetapi jika anda tidak menggunakan readmore otomatis, tida perlu melakukan langkah Keempat
6. Cari kode .post lihat rangkaian kode dibawahnya yang mirip seperti ini :
.post { margin:0.5em 0 0.4em; padding-bottom:0.4em;font:13px Verdana, Arial, sans-serif; }
ganti menjadi :.post { margin:0.5em auto 0 0.4em; padding-bottom:0.4em;font:13px Verdana, Arial, sans-serif; }
dengan menambahkan autoLangkah tersebut berguna untuk mengatur jarak setiap postingan
7. Klik simpan template
Catatan:
- Kode HTML pada setiap template berbeda beda. Jika sudah begitu, langkahnya biasanya pasti berbeda pula. Agar cara ini dapat berhasil, anda harus menyesuaikan kode kode pada template anda.
Bagaimana? apakah anda sudah berhasil membuat postingan anda menjadi dua kolom di halaman beranda blog? Sekian dulu postingan saya yang berjudul Cara Membuat Dua Kolom Postingan Di Beranda Blog, semoga bermanfaat untuk anda dan karena ini edit HTML, pasti banyak sekali ketidaksesuaiannya maka dari itu silahkan poskan komentar untuk bertanya.
keren nih 2 kolom.. :D
ReplyDeletecome back..
iya, betul
Deletemakasih udah berkomentar
wah thanks gan izin sedot yaa :D
ReplyDeleteSedot aja, gak apa kok :D
DeleteThis comment has been removed by the author.
ReplyDeleteHahahaha...hampir sama caraku biasanya,kalau mau buat 2 colum gini,Cuma beda di tag kondisionalnya,dan cssnya :)
ReplyDeleteowh, begitu ya, makasih udah berkunjung
Deletemohon kliknya ya dan mohon untuk diisi!!!:
ReplyDeletenama, email, dan jawab 5 pertanyaan dengan memilih salah satu jawaban yang telah disediakan,,, link ini hanya untuk survei kepada pengguna internet..silahkan klik:
http://www.idsurvei.com/survei/SudarFlare
atas bantuan dan partisipasinya saya ucapkan terima kasih.. Salam buat semuanya..!!!
wih, banyak banget komentar nya :D
Deletepasti keren, cuma kalau aku takut salah edit
ReplyDeletekalau takut salah edit, backup aja dulu templatenya
Deletekeren gw coban Gan ijin
ReplyDeleteiya, silahkan aja dicoba
Deletesaya praktek kan.........
ReplyDeleteok sip
Deletekq kode nya gak ada saya cari mas yg script type='text/javascript < yg ini sama ini]]>
ReplyDeletesaya lihat blog yang km share di g+ sudah 2 kolom
Deletesaran saya sih dari pada edit 2 kolom sendiri, lebih baik cari aja template yang sudah 2 kolom
karena, kode setiap template sedikit berbeda
mas mksdnya tambah auto itu gmn ya? tlong jawab :)
ReplyDeletemaksudnya pada css yang ".post { margin:0.5em auto 0 0.4em;..."
ReplyDelete