Assalamualaikum Sobat

4 Agu 2012

Cara Membuat Kolom Widget di Sebelah Kanan Header

Assalamualaikum Sobat Blogger

Kali ini saya akan menjelaskan tentang cara bagaimana membuat Kolom Widget di Sebelah Kanan Header
yang biasanya digunakan untuk menambahkan kolom iklan atau tambahan gabar animasi kesukaan sobat, ok langsung saja  caranya 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='Nano Neuton (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='Nano Neuton (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


9. Semoga Bermanfaat & Jangan lupa jika ada ganjalan sampaikan ke komentar dibawah ini.

Wassalam.

Tidak ada komentar:

Posting Komentar

Kritik & Saran Sobat :