Blog Tutorial

Tutorial Blog, Cheat Games, Tutorial Ponsel, Tutorial Komputer, Tutorial Browser

Selasa, 21 Desember 2010

Membuat elemen Postingan Berkolom - Kolom

Kategori :
oketrikpost
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

12 Komentar untuk Membuat elemen Postingan Berkolom - Kolom

asikkkkkkkkk....
akhirnya di posting juga
mkasih ya

thnaks berat nih bwat oke trick ngomng2 ajarin dunkz bagaimana membuat related post kayak punya agan thanks ya

ok gan udah aku follow nih no 280 jgn lupa fllowbalik ya please

izin copy paste mas...
aku yang dulunya admin dr www.at-tarbiyyatud-diniyyah.co.cc
yang suka copas tpi ngga' nulis sumbernya...
hehe..
sekarang aku tulis ko' sumbernya...
ouwhh.. iya makasih atas ilmu nya mudah2an bermanfa'at.

lupa lagi....
kita sama-sama saling follow mas...
sebelumnya saya ucapkan
syukron....

gan ko' tumbnhailnya susah di susun

wah makasih ya kak...soalnya slama ini saya nyari info buat kolom postingan ini gak ktemu2...tapi akhirnya ketemu juga di blognya kakak

asik, ijin coba ah gan.

www.unikgaul.com

gan udah ane coba koq gag bisa bisa

ko post saya cuma ada di sebelah kiri ya gan..??