Kalau ingin marilah kita belajar bersama-sama untuk mengerti Cara Menambah Kolom Pada Header Untuk Iklan.
Langsung saja tanpa basa basi silahkan dinikmati,,,, Untuk Membuatnya Silakan Ikuti Langkah Berikut :
§ Login ke blog anda kemudian pilih TATA LETAK
§ Klik "Edit HTML" kemudian klik expand widget
§ Agar aman, silakan anda Download dulu template anda (klik Download Template Lengkap)
§ Langkah selanjutnya (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;
}
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;
}
§ Kemudian Ganti semua kode diatas dengan kode berikut :
#header-wrapper {
width:930px;
margin:0 auto 0px;
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;
}
}
#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>
<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>
<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>
§ Langkah terakhir dan yang terpenting adalah dengan KlikSimpan dan lihat hasilnya !!!
Demikian lah yang dapat Excellenttwo sampaikan semoga bisa bermanfaat dan semoga sukses !!!!!
@
Tagged @ tutorial
