Cara Membuat Tiga Kolom di Bawah Header

Cara Membuat Tiga Colom di Bawah Header. kolom yaitu tempat untuk menyimpan hasil widget yang kita buat. nah tapi apa kalian tahu bagaimana cara membuat kolom tersebut? caranya menurut saya tidak terlalu sulit asalkan kalian bisa mengikutinya dengan teliti. sebelum kalian membuatnya saya ingin menginformasikan, apabila sobat sudah membuat tiga kolom ini, maka sobat tidak bisa lagi membuat 2 atau pun 3 kolom lagi di tempat yang lain seperti di bawah postingan atau di bawah sidebar.

  • Login Blogger
  • Pada dasbor ---> Klik Rancangan. ---> Klik Edit HTML.
  • Jangan lupa download template Lengkap, untuk berjaga-jaga kalau terjadi kesalahan kamu bisa kembali ke template awal dengan klik Download Template Lengkap.
  • Centang Expand Template Widget
  • Cari kode ]]></b:skin> setelah ketemu copas kode dibawah ini dan letakkan diatasnya
  • #box-main-container {
    clear:both;
    }
    .box-column {
    padding:0px 10px 10px 10px;
    border:1px dotted $bordercolor;
    }
  • Kemudian cari kode berikut atau yang mirip kode berikut :
<div id='main-wrapper'>
  • kemudian COPAS code yang ada di bawah ini di atas kode tadi
  • <div id='box-main-container'>
    <div id='box1' style='width: 
    30%; float: left; margin:0; text-align: left;'>
    <b:section class='box-column' id='col1' preferred='yes' style='float:left;'/>
    </div>
    <div id='box2' style='width: 
    40%; float: left; margin:0; text-align: left;'>
    <b:section class='box-column' id='col2' preferred='yes' style='float:left;'/>
    </div>
    <div id='box3' style='width: 
    30%; float: right; margin:0; text-align: left;'>
    <b:section class='box-column' id='col3' preferred='yes' style='float:right;'/>
    </div>
    <div style='clear:both;'/>
    </div>
  • kemudian save template, mudah kan....
Dapatkan update artikel terbaru kami langsung ke email anda

No Responses to "Cara Membuat Tiga Kolom di Bawah Header"

Post a Comment

pasang iklan murah