Headlines News :

Home » » Cara Membuat Postingan 3 Kolom di Blog

Cara Membuat Postingan 3 Kolom di Blog

Written By attaufiqz updhate on Selasa, 26 Februari 2013 | 02.31



Kali ini saya akan Share Cara Membuat Postingan 3 Kolom di Blog . Mendesain Blog adalah cara yang dilakukan Pemilik/ Admin / Author Blog untuk membuat tampilan blog Menjadi Menarik untuk dilihat . Kali ini saya hanya ingin Memberika Tutorial Sederhana yaitu  Membuat Postingan 3 Kolom di Blog . setelah dulu saya pernah Memberikan Tutorial tentang cara membuat Postingan 2 Kolom di Homepage , yang setelah saya coba berhasil pada Template SHARE4RT V1 . Tapi ketika di coba oleh rekan rekan saya ada yang berhasil dan ada juga yang gagal .
Mungkin ada beberapa CSS yang Berbeda . Semoga saja Tutorial saya yang satu ini akan berhasil untuk semuanya . Oke langsung saja kecaranya .
  • Masuk ke Blogger.com
  • Masuk ke Menu Template > Edit HTML
  • Cari Kode ]]></b:skin>
  • Letakan kode dibawah ini di bawah kode ]]></b:skin>
 <style type='text/css'>
.post{width:30%;height:318px;float:left;overflow:hidden;margin:0px 9px 15px 7px;padding:2px;}
.post-body{font:11px Arial;border-top:none;padding:0px 8px;margin:0;;text-align:justify;height:515px}
.post h1,.post h2{font:bold 11px Tahoma;line-height:1.3em;padding:6px 8px;text-shadow:none}
.cutter{width:100%;max-height:145px;overflow:hidden;margin:0;padding:0}
.postthumb{width:auto;margin-bottom:-45px;padding:0}
@media screen and (max-width:970px) {
 .post{margin:5px 0 5px 4px;width:46.5%;padding:5px;border:none;height:auto;}
.post h1,.post h2{font:bold 12px Tahoma;}
.post-body{height:45px}
}
@media screen and (max-width:460px){
.post{margin:14px 12px 0;width:auto;padding:10px}
.cutter{max-height:165px}
}
@media screen and (max-width:310px){
  .post{width:88%;margin:10px;padding:5px}
.cutter{max-height:155px}
}
</style>
  • Silahkan di Preview dahulu . jika sudah silahkan di Save Template .

Demikianlah Cara Membuat Postingan 3 Kolom di Blog, Semoga Bermanfaat .

Share this article :

0 komentar:

Speak up your mind

Tell us what you're thinking... !

facebook like box

 
█║▌│█│║▌║││█║▌│║▌║█║║▌
creating website 2013 | multimedia community Copyright © 2014. attaufik computer - All Rights Reserved
Template Modified by attaufiqz | attaufikcomputer