Pages

Jumat, 06 Juli 2012

Membuat Kolom Widget di Sebelah Kanan Header


Hallo para Blogger
Postingan kali ini saya akan menjelaskan tentang bagaimana membuat Kolom Widget di Sebelah Kanan Header
langsung saja  cara, berikut:

1.Pertama masuk dulu ke akun Blogger masing-masing
2.Klik Rancangan lalu Edit HTML
3.Jangan lupa centang Expand Widget Template atau backupa dulu templatenya

4.Cari deretan kode seperti di bawah ini.

#header-inner {
background-position:center center;
margin-left:auto;
margin-right:auto;
}
#header {
color:#000000;
text-align:left;
}
#r_head{
width:300px;
float:left;
padding-top:10px;
}

5. Kemudian ganti kode-kode tersebut dengan kode di bawah ini.

#header-inner {
width:432px;
background-position:left;
margin-left:auto;
margin-right:auto;
float:left;
}
#header {
color:#000000;
text-align:left;
}
#r_head{
width:468px;
float:left;
padding-top:10px;
}

6. Setelah itu carilah kode seperti di bawah ini.

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Kreasi Jendrix (Header)' type='Header'/>
</b:section>
</div>

7. Kemudian tambah kode berwarna merah sehingga hasilnya menjadi seperti di bawah ini.

<div id='header-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Kreasi Jendrix (Header)' type='Header'/>
</b:section>
</div>
<div id='r_head'>
<b:section class='header' id='header2' preferred='yes'/>
</div>
</div>

8. Setelah selesai mengedit Klik SIMPAN
maka hasilnya akan seperti gambar di bawah ini

Tidak ada komentar:

Posting Komentar