Cara Membuat Header Menjadi 2 Kolom Di Blog

Salam buat sobat2 blogger semua. Kali ini saya ingin share tentang bagaimana Cara Membuat Header Menjadi 2 Kolom Di Blog. Untuk mengetahui langkah-langkah nya, mari langsung aja ke tkp :

1. silahkan login akun blogger anda
2. klik menu template, edit html
3. centang expand template widget
4. cari code berikut ini (gunakan CTRL+F agar lebih cepat)

---

#header-wrapper
{
  height:80px;
  width:950px;
  font-family:Helvetica;
}

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

#header
{
  text-shadow:1px 1px 1px #FCFCFC;
  text-align:left;
  margin:15px 0 0;
}

---

5. setelah ketemu code di atas, lalu hapus dan ganti dengan code di bawah ini

---

#header-wrapper {
width:960px;
margin:0 auto 0px;
background:$bgheadercolor url(http://ahom24.googlepages.com/magazine_01.jpg) no-repeat top center;
height:180px;
}

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

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

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

---

6. cari lagi code berikut ini

---

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

---

7. setelah ketemu code di atas, lalu hapus dan ganti dengan code di bawah ini

---

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

---

8. klik simpan template , dan selesai ..

Gampang kan cara nya ,, gak susah2 kog :)

Posted in ngeblog