CARA MEMBAGI 2 KOLOM HEADER
Usep Suryana
22 Des 2013
3
comments
Buat sobat Blogger Copast yang suka permak blog, ni ane kasih satu tips lagi buat
sobat blogger. Kali ini ane akan kasih tahu bagaimana cara membuat
header blog anda menjadi berkepala dua lebih
tepatnya membuat header menjadi 2 kolom. Ini dia Tutorial nya!!!
1. Pertama sobat login ke akun blog sobat
2. Klik rancangan--> edit HTML
3. Jangan centang kotak expand template widget
4. Cari kode css yang mirip di bawah ini:
#header-wrapper {
width:900px;
margin:0 auto 0px;
background:$bgheadercolor;
height:190px;
}
#header-inner {
width:900px;
background-position: center;
margin-$startSide: auto;
margin-$endSide: auto;
}
#header {
margin: 0px;
text-align: left;
color:$pagetitlecolor;
}
#header-wrapper {
width:900px;
margin:0 auto 0px;
background:$bgheadercolor;
height:190px;
}
#header-inner {
width:900px;
background-position: center;
margin-$startSide: auto;
margin-$endSide: auto;
}
#header {
margin: 0px;
text-align: left;
color:$pagetitlecolor;
}
5. Ganti kode di atas dengan kode berikut.
#header-wrapper{
width:980px;
padding:20px 0 0 0;
background:#000000;
margin:0 auto;
border:;}
#header-inner{
background-position:center;
margin-left:auto;
margin-right:auto}
#header{
float:$startSide;
width:400px;
margin:0 auto;
border:0px solid $bordercolor;
text-align:left;
color:$pagetitlecolor
}
#header2{
float:$endSide;
width:400px;
margin:0 auto;
text-align:left;
}
ket : width nya bisa di ubah ke PERSEN (%)
6. Scroll ke bagian bawah, dan temukan kode yang mirip seperti ini
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='judul blog (Header)' type='Header'/>
</b:section>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='judul blog (Header)' type='Header'/>
</b:section>
Fokuskan pencarian pada kode <div id='header-wrapper'>
7. Ganti kode di atas dengan kode berikut:
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='judul blog(Header)' type='Header'/>
</b:section>
<b:section class='header' id='header2' maxwidgets='1' showaddelement='yes'/>
<div style='clear:both;'/>
</div><!-- end header-wrapper -->
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='judul blog(Header)' type='Header'/>
</b:section>
<b:section class='header' id='header2' maxwidgets='1' showaddelement='yes'/>
<div style='clear:both;'/>
</div><!-- end header-wrapper -->
8. Klik simpan perubahan
9. Langkah terakhir, klik ELEMEN LAMAN dan lihat bila sudah menjadi 2 kolom.
9. Langkah terakhir, klik ELEMEN LAMAN dan lihat bila sudah menjadi 2 kolom.
Selesai
Selamat mencoba & semoga dapat membantu anda!!
Sumber : http://christiantatelu.blogspot.com/2011/10/cara-membagi-header-menjadi-2-kolom.html
Sumber : http://christiantatelu.blogspot.com/2011/10/cara-membagi-header-menjadi-2-kolom.html
Artikel Terkait
TERIMA KASIH ATAS KUNJUNGAN SAUDARA
Judul: CARA MEMBAGI 2 KOLOM HEADER
Usep Suryana | Twitter | Facebook Page
Published :22 Des 2013 Jam 12.42
Silakan jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi tulisan ini. Terima kasih sudah singgah serta membacanya, Semoga tulisan ini bermanfaat bagi sobat Blogger Copast semuanya amin.
Usep Suryana | Twitter | Facebook Page
Published :22 Des 2013 Jam 12.42
Silakan jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi tulisan ini. Terima kasih sudah singgah serta membacanya, Semoga tulisan ini bermanfaat bagi sobat Blogger Copast semuanya amin.
Mantaaap sob artikelnya, kereeen :)
BalasHapusIjin share http://apotekherbalkita.com/obat-tradisional-asma/
http://apotekherbalkita.com/
http://grosiracemaxstasik.com/
http://pengobatanalamimustajab.com/
terimakasih infonya gan
BalasHapushttp://ramuantradisionalkita.com/pengobatan-tradisional-torsio-testis/
thanks ka infonya sangat membantu :)
BalasHapushttp://obatacemaxsid.com/obat-tradisional-darah-tinggi/