December 13, 2015

Cara Membagi Header Blog Jadi Dua Bagian

December 13, 2015

desain header blog
Cara Membagi Header Blog Jadi Dua Bagian - Untuk Logo (Nama Blog) & Iklan.

UMUMNYA template blog bawaan blogger hanya satu bagian, yaitu buat Nama Blog atau Logo Header doang. Sebelah kanannya kosong. Sayang 'kan?

Coba kalu dibagi menjadi dua bagian. Satu untuk logo atau nama blog (blog title). Satu lagi untuk banner iklan (Google Adsense misalnya) atau widget lainnya.

Header sangat penting karena pengunjung hampir selalu menengok nama blog yang ada di header. Yang namanya "kepala" (header) bahkan selalu menjadi bagian utama yang dilihat.

Perhatikan gambar Layout Header Blog di bawah ini, yang tadinya satu bagian menjadi dua bagian.


Asal Header Blog Satu Bagian:

Header Blog

Header Blog Menjadi Dua Bagian:

Header Blog

Umumnya, template blog custom, yakni template blog seo friendly terbaru yang bukan bawaan blogger (default template), sudah dibagi menjadi dua bagian, bahkan ada juga yang menjadi tiga bagian.

Nah, jika header blog Anda hanya satu bagian, untuk logo doang, dan ingin dibagi menjadi dua bagian, berikut ini tipsnya.

Cara Membagi Header Blog Jadi Dua Bagian

1. Klik "Template" --> klik "Edit HTML"
2. Copas kode berikut ini di atas kode <b:section class='header' ....

<div class='cb-blogheader'>

3. Copas kode berikut ini setelah kode </b:section>

<b:section class='cb-blogheader-right' 
id='cb-blogheader-right' maxwidgets='1' 
showaddelement='yes'>
</b:section>
</div>
<!-- /cb-blogheader -->
<div style='clear: both'/>

4. Copas kode berikt ini di atas kode ]]></b:skin> atau </style>

.cb-blogheader {
position: relative;
width: 100%;
}
#header {
padding: 0;
margin:0;
overflow:hidden;
float:left; width:35%;
}
#cb-blogheader-right {
padding: 0;
margin:0;
overflow:hidden;
float:right;
width:65%;
}

5. Save Template!

Kini kembali ke Dashboard dan klik "Layout". Akan Anda lihat Header Blog Anda sudah terbagi menjadi dua bagian. Good Luck & Happy Blogging! (http://www.contohblog.com).*


Previous
« Prev Post
Author Image

CB Blogger

Recommended Posts

Related Posts

Show comments
Hide comments

4 comments on Cara Membagi Header Blog Jadi Dua Bagian

  1. saya sudah coba kedua cara tapi blog saya teteap aja gakbisa hedernya memang jadi 2 tapi bukan kanan dan kiri possisinya melainkan atas dan bawah, Mohon pencerahanya Trimakasih

    ReplyDelete
  2. WUIH MANTAP NIH,,IZIN AWAK COPAS ADMIN,,BRAVO CB

    ReplyDelete

Contact Form

Name

Email *

Message *