News
Loading...

Cara Permak Header Menjadi Dua Bagian

Yes berhasil juga akhirnya mbagi header menjadi dua bagian. Sekarang saatnya bagi-bagi ke Permaker semua. Kalau dua artikel sebelumnya dah dikasih tau tentang bagaimana menyembunyikan Judul/diskripsi Blog dan bagaimana menambah gambar pada header kali ini membahas cara membuat header menjadi dua bagian. Mau langsung atau ngobrol dulu? langsung aja ya ntar malah ngantuk...

Ikuti langkah - langkah di bawah ini :
  1. Masuk ke Account Blogger kamu
  2. Pilih Tata Letak klik Edit Html ( jangan lupa contreng "Expand Template Widget").
  3. Cari code di bawah ini :

  4. /* Header
    ===================================
    */
    #header-wrapper {
    width:900px;
    margin:0 auto 0px;
    background:$bgheadercolor;
    height:190px;
    }

    #header-inner {
    width:900px;
    background-position: center;
    margin-$startSide: auto;
    margin-$endSide: auto;
    }

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

    Kalau beda yang penting cari CSS bagian header biasanya
    /* Header
    ===================================
    */

    ................... samai dengan
    }
    /* Posts
    ----------------------------------------------- */

  5. Hapus kode bagian header diatas ganti dengan kode di bawah ini:

  6. /* Header
    ===================================
    */

    #header-wrapper {
    width:900px;
    margin:0 auto 0px;
    background:$bgheadercolor;
    height:190px;
    }

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

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

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


  7. Selanjutnya cari code di bawah ini :

  8. <div id="header-wrapper">
    <b:section class="header" id="header" maxwidgets="1" showaddelement="no">
    <b:widget id="Header1" locked="true" title="Nama blog anda (Header)" type="Header">
    </b:widget>
    </b:section></div>


    Hapus kode di atas dan ganti dengan kode 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='Test Blog (Header)' type='Header'/>
    </b:section>
    </div>
    <div id='r_head'>
    <b:section class='header' id='header2' preferred='yes'/>
    </div>
    </div>

  9. Ok sudah selesai tinggal klik save template, trus klik Tab elemen halaman nah jadikan sekarang headernya jadi dua bagain satu buat logo satu bisa buat banner atau google adsense.
Gampangkan ? gampang dan menyenangkan memang permak blogs, kalau bisa itu puas rasanya.. bagaimana dengan kamu?

OK semoga berhasil ya.

NB : lebar kolom(width) di atas silahkan disesuaikan keinginan anda trial and error aja, Trus kalau template kamu berbeda sialhken lapor aja nanti kita bantu tenang aja :).


Share on Google Plus
    Blogger Comment
    Facebook Comment

1 komentar :

  1. Bos sorri nih ganggu...di blog gue kok g bisa y?
    mohon bimbingannya...he2

    http://trigonalworld.blogspot.com/

    BalasHapus