Cara Menambah dan membagi Elemen di Bawah Header

Sebelum Menulis artikel ini saya mengucapkan terimakasih kepada sobat Bloger yang telah memberikan inspirasi untuk menambah isi artikel tips trik blog, tips trik ini saya ambil dari beberapa artikel diantara nya artikel nya kang Rohman dan di http://activekita.blogspot.com/, tetapi saya hanya mengambil tutorial nya saja, saya akan menggabung kan kedua artikel tersebut sengaja saya buat tutorial ini untuk mengingatkan saya tentang cara membagi header menjadi 2 kolom yang nantinya akan saya tempatkan 2 iklan.
Pertama saya akan membahas mengenai menambah elemen di bawah header Begini caranya:
1. Masuk ke blog sobat disini
2. Klik tata letak.
3. Klik edit HTML.
4. Klik download lengkap template
5. Centang Expand widget.
6. cari kode seperti ini ]]></b:skin>
7. Lalu tambahkan kode berikut di atas kode ini ]]></b:skin>

#under_header{
margin:10px 0;
padding:1%;
width:98%;
}

8. Cari scrip seperti ini atau agak sama seperti script berikut
<div id='header-wrapper'> 
<b:section class='header' id='header' maxwidget="1" showaddelement="no">
<b:widget id='Header1' locked='true' title='BLOG NYA RABEL 306(Header)' type='Header'/>
</b:section>
    </div>

9. Tambah kan script berikut tepat di bawah script no.8

<div id="under_header">
<b:section class='header' id='underheader' preferred='yes'/>
</div>

10. Lalu simpan template, klik tata letak dan lihat hasil nya

Tutorial ke dua saya akan menulis Cara membagi elemen di bawah header menjadi 2 kolom Begi caranya"
1. Masuk ke blog sobat disini
2. Klik tata letak.
3. Klik edit HTML.
4. Klik download lengkap template
5. Centang Expand widget.
6. cari kode seperti ini ]]></b:skin> dan letakkan kode seperti ini tepat di atas nya

#under_header1{
float:left;
width:50%;
}
#under_header2{
float:right;
width:50%;
}
7. Lalu cari kode seperti di bawah ini:

<div id='header-wrapper'>
<b:section class='header'id='header'maxwidget="1'showaddelement="no">
<b:widget id='header1'locked='true'title='nama blog sobat(header)'
type='header'/>
</b:section>
</div>

8. Jika sudah ketemu letakkan kode dibawah ini tepat dibawah kode no.7

<div id='under_header1'>
<b:section class='header' id='underheader1' preferred='yes'/>
</div>

<div id='under_header2'>
<b:section class='header' id='underheader2' preferred='yes'/>
</div>

9. Lalu simpan template, klik tata letak dan lihat hasil nya
Slamat Mencoba semoga bermanfaat mohon maaf kepada sobat yang kebetulan membaca artikel ini apabila ada keslahan, tolong koreksi nya.

Catatan : Jangan Lupa Baca dan Klik Dibawah ini ya

Artikel Keren Lainnya