Hai sobat blogger!!! Buat 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 (Hi... ngeri dengernya..) 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:
5. Ganti kode di atas dengan kode berikut.#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: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
Semoga membantu!!
This is dummy text. It is not meant to be read. Accordingly, it is difficult to figure out when to end it. But then, this is dummy text. It is not meant to be read. Period.
ConversionConversion EmoticonEmoticon