Tuesday, December 27, 2011

Menambah Kolom Pada Header Untuk Iklan

Terkadang suatu template baru tidak langsung menyediakan space untuk iklan di kolom header (contoh seperti pada gmbar di bawah ini),


Untuk Membuatnya Silahkan Ikuti Langkah Berikut :
  • Login ke blomu terlebih dahulu
  • Pilih ‘TATA LETAK’
  • Klik "Edit HTML"
  • Agar aman, silakan anda Download dulu template anda (klik Download Template Lengkap), Pada bagian atas
  • (gunakan Ctrl + F) Cari kode CSS seperti dibawah ini atau yang mirip (tergantung templete anda) :
#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
}

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
  • Ganti semua kode diatas dengan kode berikut :
#header-wrapper {
width:930px;
margin:0 auto 0px;
background:#38610B url(http://i33.tinypic.com/sw6cfo.jpg) no-repeat top center;
height:180px;
}

#head-inner {
width:500px;
background-position: left;
margin-left: auto;
margin-right: auto;
float:left;
}

#header {
margin: 0px;
text-align: left;
color:#ffcc66;
}

#r_head{
width:430px;
float:left;
padding-top:10px;
}
  • Selanjut nya cari kode :
    <div id='header-wrapper'>
    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
    </b:section>
    </div>
  • Jika sudah Ketemu, ganti kode tersebut diatas dengan kode :
    <div id='header-wrapper'>
    <div id='head-inner'>
    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
    </b:section>
    </div>
    <div id='r_head'>
    <b:section class='header' id='header2' preferred='yes'/>
    </div>
    </div>
  • Klik Simpan
  • Selesai

0 comments :

Post a Comment