Cara Membagi Header Template Menjadi Dua Kolom

Membagi Header Template Menjadi Dua Kolom

Cara Membagi Header Template Menjadi Dua Kolom dan Cara Membagi/membuat Header Menjadi Dua Kolom di Blog Untuk memperlengkap tutorial blog design tamplate yang sesudahnya. kali ini kita coba membahas cara membagi / membuat header menjadi dua bagian kolom. biasanya default header kan cuman satu, nah header itu bisa di bagi menjadi dua bagian. coba anda lihat contoh di bawah ini.
silahkan klik gambar untuk memperbesar
Nantinya elemen baru itu tadi dapat digunakan untuk penempatan iklan, gambar atau widget lainnya. Nah untuk membuatnya anda sedikit menambah kan kode css ke dalam tamplate. yang ingin menerapkan article ini silahkan ikuti tips-tips dibawah ini.

Cara Membagi Header Template Menjadi Dua Kolom.

Cara Membagi Header Template Menjadi Dua Kolom





  • Log in dulu ke blogger
  • Tata letak
  • Edit HTML
  • Download tamplate anda untuk mengatasi hal-hal yang tak diinginkan
  • Jangan lupa kasi tanda centang di kotak kecil kanan atas
Kemudian cari kode

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
}

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

Kemudian hapus dan ganti dengan kode di bawah ini

#header-wrapper {
width:930px;
margin:0 auto 0px;
background:#38610B;
height:180px;
}

#head-inner {
width:500px;
background-position: left;
margin-left: auto;
margin-right: auto;
float:left;
}

#header {
margin: 0px;
text-align: left;
color:#ffcc66;
}

#r_head{
width:430px;
float:left;
padding-top:10px;
}


Kemudian cari kode






Hapus dan ganti dengan kode :










kemudian save tamplate anda dan lihat hasilnya.

Selamat mencoba........

2 komentar:

Silahkan Berkomentar Mengenai Postingan Ini