Politik    Sosial    Budaya    Ekonomi    Wisata    Hiburan    Sepakbola    Kuliner    Film   
Home » » Cara Menambah Kolom Pada Header Untuk Tempat Iklan

Cara Menambah Kolom Pada Header Untuk Tempat Iklan

Posted by Cara Belajar Editing Video on Saturday, February 25, 2012




Cara Menambah Kolom Pada Header Untuk Tempat Iklan | Maksud dari judul artikel diatas, bisa anda lihat pada gambar dibawah berikut :

Pada gambar diatas kolom sebelah kanan merupakan kolom yang akan kita buat/tambahan, kolom tambahan tersebut bisa kita gunakan untuk pasang Iklan atau lainnya terserah untuk apa anda inginkan, karena pada dasarnya kolom pada header sebelah kanan yang akan kita buat tersebut berfungsi sama dengan sidebar blog.

Untuk Membuatnya Silakan Ikuti Langkah Berikut :
  • Login ke blog anda Klik DISINI, silakan isi email dan password blog anda
  • Pilih ‘TATA LETAK’
  • Klik "Edit HTML"
  • Agar aman, silakan anda Download dulu template anda (klik Download Template Lengkap), Pada bagian atas
  • (gunakan Ctrl + F) Cari kode CSS seperti dibawah ini atau yang mirip (tergantung templete anda) :
#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;
}
  • Ganti semua kode diatas dengan kode berikut :
#header-wrapper {
width:930px;
margin:0 auto 0px;
background:#38610B url(http://i33.tinypic.com/sw6cfo.jpg) no-repeat top center;
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;
}
  • Selanjut nya cari kode :
  • <div id='header-wrapper'>
    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
    </b:section>
    </div>
  • Jika sudah Ketemu, ganti kode tersebut diatas dengan kode :
  • <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='Test Blog (Header)' type='Header'/>
    </b:section>
    </div>
    <div id='r_head'>
    <b:section class='header' id='header2' preferred='yes'/>
    </div>
    </div>
  • Klik Simpan
  • Selesai, Sukses Selalu

SHARE :
CB Blogger

Post a Comment

Belajar video editing

Note: Only a member of this blog may post a comment.

 
Copyright © 2014 Cara Belajar Editing Video. All Rights Reserved. Powered by Blogger
Template by Creating Website and CB Blogger