Membuat elemen Postingan Berkolom - Kolom

Seperti yang di request oleh saudara Muhammad Chandra, tentang Blogging maka saya kan membuatkannya. Sebenarnya trik ini sudah banyak blogger - blogger lain telah mempost di blog mereka masing - masing jadi maaf y kalau ada yang bilang saya repost, saya cuma ingin mengabulkan request dari teman dan pengunjung blog ini saya aja.

Sebenarnya trik ini hanya memainkan width, height dan b:if cond. Trik ini hanya sederhana namun kalau kita lihat dari tampilannya sepertinya rumit untuk membuatnya. trik ini saya pakai pada template saya yang Green Black. oke langsung aja yuk ke caranya, sebagai modelnya kita pakai template minimalist dari blogger.

1. Login ke blogger
2. masuk ke Rancangan >> Edit HTML
3. setelah itu cari kode di bawah ini
   
   
   .post {
     margin:.5em 0 1.5em;
     border-bottom:1px dotted $bordercolor;
     padding-bottom:1.5em;
     }
   
   dan
   
   
   .post-body {
     margin:0 0 .75em;
     line-height:1.6em;
   }
   
4. Setelah itu ganti menjadi seperti di bawah ini
   
   
   .post {
   margin:.5em 10px 1.5em 20px;
   width:240px; /*dapat kamu ganti, untuk menyesuaikan ukuran main-wrapper*/
   padding:5px 15px 5px 15px;
   float:left;
   }
   
   dan
   
   
   .post-body {
   line-height:1.4em;
   margin:0 0 0.75em;
   height:150px;  /*dapat kamu ganti, sesuai keinginan*/
   overflow:hidden
   }
   
5. setelah itu cari kode ]]></b:skin> dan tambahkan kode di bawah ini tepat di atasnya
   
   
   <b:if cond='data:blog.pageType == &quot;item&quot;'>
   <style type='text/css'>
   .post {
   width:100%;
   margin:.5em 11px 1.5em 3px;
   }
   .post-body {
   height:100%;
   }
   </style>
   </b:if>
   
6. Dan setelah semua langkah di lakukan kamu dapat menyimpannya dan melihat hasilnya

Benar - benar simple bukan trik ini? di atas saya menggunakan sample template minima blogger, jadi semua kode yang harus di cari tidak pasti sama, tapi terpenting ada pada nama classnya yaitu post dan post-body. Mungkin itu saja yang bisa saya sampaikan, kalau ada kesulitan atau request, tinggalkan saja pesan kamu di kotak komentar, tidak usah sungkan - sungkan dan takut, toh saya gak gigit qo ^_^. Terima kasih dan Happy Blogging.

Bagikan Artikel : Facebook Twitter Google+ Linkedin Technorati Digg