Membuat Posting Berkolom-kolom

Udah lama nih engga pernah update, sekarang waktunya untuk kembali mengurusi blog ini. Sekarang saya ingin memberikan tutorial mengenai cara membagi post body atau kolom postingan menjadi berkolom-kolom seperti yang terpasang di Cellar Template. Oke langsung aja ya, seperti biasa kamu login aja dulu terus langsung masuk ke Edit Html.


 Setelah itu cari kode seperti ini dan langsung tambahkan kode-kode yang saya beri warna merah


.post {
margin:.5em 10px 1.5em 0;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
width:48%;
float:left;
}

Lalu setelah itu cari lagi kode berikut ini dan tambahkan juga kode yang diberi warna oranye

.post-body {
margin:0 0 .75em;
line-height:1.6em;
height:150px;
overflow:hidden;
}


Setelah itu letakan kode html berikut di atas kode

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:else/>
<style>
.post {margin:.5em 0px 1.5em; width:100%;}
.post-body {height:100%;}
</style>
</b:if>
 
Selesai, nah sekarang Itukan untuk 2 minipost untuk satu baris, bagaimana untuk 3 minipost dalam satu baris? tinggal ganti saja lebar 48% tersebut sekitar 32%. 4 minipost? ya sekitar 24.5% dan seterusnya.

26 komentar:

  1. pertamax....
    keren sob... kek kolom koran gitu ya...

    BalasHapus
  2. Makin Kaya aja is...Tutornya..Simpan dulu ah, ntar diPraktekinnya...

    Comeng Balik is..!!!

    BalasHapus
  3. wah postingan yg harus saya praktekan nih gan, thankz ya

    BalasHapus
  4. iya juga bisa utk sidebar yah aisss

    BalasHapus
  5. hm.. bagus ne infony.. izin bookmark dolo ah., hehe

    BalasHapus
  6. contohnya gmn niy??? gak ngerti maksudnya mas ais...

    BalasHapus
  7. @mas doyok : iya bisa juga tuh mas
    @danuakbar : silahkan di bookmark mas
    @kumpulan bisnis : ya kayak dihalaman depan blog ini jadi kotak2 gitu...

    BalasHapus
  8. keren sobat...

    tp kl cmn di buat minipost satu post di atas posting asli kita bisa di trpkn g yah kira2??

    BalasHapus
  9. menarik ni postingannya, ntar deh saya coba

    BalasHapus
  10. iya kalo terpisah jadi kelihatan lebih rapi :)

    BalasHapus
  11. Sip ini ais, coba di blogq satunya ah.. terima kasih ais

    BalasHapus
  12. Ilmu baru nih. terima kasih

    BalasHapus
  13. bagus tutorial dari sobatku yang satu ini.. lanjutkan sob..

    BalasHapus
  14. nambah satu lagi nih master2 blogger

    BalasHapus
  15. Sekarang banyak master gentayangan yah,,,hehehe..
    Info menarik,tak coba langsung deh...

    BalasHapus
  16. Wah boleh juga nih siais...!!!

    BalasHapus
  17. sip sip sip pokoke...
    keep blogging....

    BalasHapus
  18. hmm terkadang membuat bingung cara membuat mini post nih tp sip deh untuk pembahasannya :D

    BalasHapus
  19. meski gua gaptekj,,akhir akhir ni gua doyan otak atik web..untung untung bisa bermanfaat

    BalasHapus
  20. keren ne triknya, trim yaw ais

    BalasHapus
  21. Diatas kode apa? masih kurang paham!! :)

    BalasHapus
  22. Otak-atik HTML memang seru. Tapi bagi blogger baru seperti saya sering kali tidak berani mencoba

    BalasHapus
  23. berguna banget nih sob triknya, makasih ya.

    BalasHapus


Thanks for visit, I hope you enjoy!
Do you have any suggestions? Add your comment. Please don't spam!