Sabtu, 17 Januari 2015

Cara Membagi Header Blog Menjadi Dua Elemen

Gambar header blog dibagi menjadi dua
Gambar header blog dibagi menjadi dua

Mendesain blog dengan tampian bisa dibilang susah-susah gampang, yang penting ada sedikit kemauan pasti bisa. Salah satunya membagi header bog menjadi dua elemen, dan elemen ini nantinya dapat dipasang widget untuk menampilkan iklan.

Admin blog membagi header menjadi dua kolom biasanya untuk mengoptimalkan pemasangan Ads, dimana penempatan di header banyak diminati pengunjung. Langsung saja, berikut ini cara membagi header blog menjadi dua bagian.

Cara membagi header blog menjadi dua elemen :
  • Login ke akun blogger, pilih template > edit html.
  • Cari kode seperti berikut ini, mempercepat pencarian tekan Ctrl + F.
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</b:includable>
</b:widget>
</b:section>
</div>
</div> 
  • Copy & Paste kode berikut ini di antara kode </b:section> and </div>
<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/> 
  •  Hasilnya seperti ini
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</b:includable>
</b:widget>
</b:section>
<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>
</div>
</div> 
  • Copy + Paste kode berikut ini di atas atau sebelum kode ]]></b:skin>
#header, body#layout #header {width:300px;display:inline-block;float:left;}
#header-right, body#layout #header-right {width:468px;display:inline-block;float:right;padding:15px;}
#header-right .widget {margin:0;} 

Catatan :
Angka 300 (untuk space nama blog/logo di kiri) dan 468 (untuk space iklan di kanan) bisa diubah. Kalau ragu, biarkan seperti itu. 

The author of the blog Teknologivirtual

2 comments

Mantap... Trimakasi Infonya

Ma sama senang bisa memberikan manfaat


EmoticonEmoticon