SERVIS SANYO BLUMBUNGAN

.
Home » » tutorial cara membuat header menjadi 2 kolom

tutorial cara membuat header menjadi 2 kolom

tutorial ini adalah buat newbie blogger yang masih belom tau cara membagi header blog menjadi 2 kolom. sehingga anda dapat meletakkan 2 banner dalam header blog anda.      seperti contoh gambar dibawah ini


agar lebih jelas LIHAT DEMO DISINI

CARA MEMBAGI HEADER JADI 2 KOLOM SEBAGAI BERIKUT:

1.login di blogger sobat

2.masuk ke dashboard |design | edit HTML

3.centang kotak kecil "expan widget template" lalu cari kode dibawah ini


#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;

}

4. setelah ketemu  ganti semua kode diatas dengan kode dibawah ini:

#header-wrapper{

width:980px;

padding:20px 0 0 0;

background:#000000;

margin:0 auto;

border:;}

#header-inner{

background-position:center;

margin-left:auto;

margin-right:auto}

#header{

float:$startSide;

width:400px;

margin:0 auto;

border:0px solid $bordercolor;

text-align:left;

color:$pagetitlecolor

}

#header2{

float:$endSide;

width:400px;

margin:0 auto;

text-align:left;

}

5. cari kode berikut:

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

fokuskan pencarian pada kode <div id='header-wrapper'>

6. lalu ganti semua kode di atas dengan kode dibawah ini:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='judul blog(Header)' type='Header'/>
</b:section>
<b:section class='header' id='header2' maxwidgets='1' showaddelement='yes'/>
<div style='clear:both;'/>
</div><!-- end header-wrapper -->

7. simpan template. dan lihat hasilnya.dengan klik menu DESIGN .
perhatikan perubahannya. apakah sudah ada 2 element pada header blog anda. jika sudah ada 2 element header silahkan anda pasang banner blog anda/iklan bisnis anda pada masing2 element.

semoga membantu dan happy blogging


26 comments:

  1. Terima kasih telah berbagi mas.

    BalasHapus
  2. Mantaf infonya mas. Sukses selalu ya...

    BalasHapus
  3. wahhh..kedatangan tamu sahabat-sahabat terbaik wordpress :-)

    thanks sobat sobat.. mas noer dan mas abed. lama gak jumpa..maaf klo saya gak sempat blogwallking ahir-ahir ini..karena kesibukan yang masih banyak tertunda...

    terimakasih atas kunjungan sobat sobat sekalian..salam sukses buat sahabat rajacolek..:-)

    BalasHapus

  4. nandobase :
    Buat blogspot ya, Gan?



    hehehe iyaa gan itu buat blogcepot... thanks kunjungannya:-)

    BalasHapus
  5. Artikel yang sangat informatif. Lengkap dengan kode dan tutorial nya. :)

    BalasHapus

  6. Nila :
    Artikel yang sangat informatif. Lengkap dengan kode dan tutorial nya.


    semoga bermafaat buat yang membutuhkan:-) thanks atas kunjungan mbak nila

    BalasHapus
  7. belum bisa nih mas gimana yah cara nya ?

    BalasHapus

  8. vinojaja :
    belum bisa nih mas gimana yah cara nya ?


    kenapa gak bisa.apa masalahnya? bisa di jelaskan gak biar saya bisa bantu.

    BalasHapus
  9. terima kasih banyak infonya, terus posting ilmu-ilmu yg sangat bermafaat,,

    BalasHapus

  10. hakim :
    terima kasih banyak infonya, terus posting ilmu-ilmu yg sangat bermafaat,,



    sama2 mas...semoga blogger indoneia semakin maju dan sukses:-)

    BalasHapus

  11. sundaboy :
    terimakasih mas bro


    thank juga atas kunjungannya sob

    BalasHapus
  12. ijin naroh di blog ane gan

    BalasHapus
  13. oke silahkan gan semoga bermamfaat:-)

    BalasHapus
  14. Kurang Puas dengan postinganya.....

    BalasHapus

  15. Aira :
    Kurang Puas dengan postinganya…..


    postingan di blog ini sderhana semua...jika anda kurang puas saya minta maaf..karena hanya itu kemampuan saya:-)

    BalasHapus
  16. gan,,,,blog saya gak bisa di jadiin 2 header....sudah saya coba tutornya,tapi gagal maning gagal maning...

    BalasHapus
  17. yang bikin gagal kenapa?coba di jelaskan masalahnya agar saya dapat membantu

    BalasHapus
  18. kenapa bisa gagal terus..bisa di jelaskan gak masalahnya agar saya bisa membantu

    BalasHapus
  19. keren , nice tutorial, bermanfaat banget :)

    BalasHapus
  20. terimakasih bossss....salm sukses buat agan:-)

    BalasHapus
  21. Sangat bermanfaat.. untuk pasang banner di header blogger. :)

    BalasHapus
  22. Yupzzz bagus juga untuk banner promosi gan:-D

    BalasHapus
  23. terimakasih tip n triks serta tutorialnya... sangat2 berguna untuk q... thanks n lam kenal...

    BalasHapus

ayukk berikan tanggapan di kotak komentar ini

DAFTAR POST

Translate blog

DONASI/DONATION

donation this blog my bank

BANK: BRI atas nama: abdus syukkur
No Rek: 6470-01-015176-538

Popular Posts

komentar terbaru

Servis pompa air blumbungan

google+

.comment-content a {display: none;}