Kebanyakan header hanya terdiri 1 kolom saja,ini bisa jadi sengaja di buat hanya 1,kemungkinan karena suatu hal tertentu.Akan tetapi tidak jarang juga ada sebagian blog yang headernya terdiri atas 2 kolom.Nah apabila teman - teman ingin membuatnya menjadi 2 bagian,yaitu cukup dengan sedikit menambah kan kode css ke dalam tamplate.Untuk lebih jelasnya lakukan langkah - langkah berikut :
- Log in dulu ke blogger
- Tata letak
- Edit HTML
- Download tamplate anda untuk mengatasi hal-hal yang tak diinginkan
- Jangan lupa kasi tanda centang di kotak kecil kanan atas
- Kemudian cari kode
#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 hapus dan ganti dengan kode di bawah ini
#header-wrapper {
width:930px;
margin:0 auto 0px;
background:#38610B;
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;
}
width:930px;
margin:0 auto 0px;
background:#38610B;
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;
}
- Kemudian 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>
- Hapus dan ganti 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>
- kemudian save tamplate
- Selesai
Selamat mencoba,semoga bermanfaat.***
0 komentar:
Posting Komentar