Untuk mendapatkan space iklan dihalaman ini silahkan hubungi owner Blog Design, Kami akan secepatnya merespon dan mempertimbangkan letak dari iklan text dan banner anda...

Thursday, February 28, 2013

cara menambah 1 kolom gadget dibawah header

cara menambah 1 kolom gadget dibawah header
Kolom gadget pada layout template blog kita berguna untuk berbagai hal, biasanya kegunaan gadget dibawah header ini untuk iklan sponsor. dengan adanya gadget dibawah header terkadang penempatan iklan sponsor kita lebih mudah terlihat dan hal ini akan menguntungkan kita. Untuk bahasan kali ini saya akan menerangkan kepada sobat bloger semua bagaimana kita dapat menambahkan 1 kolom gadget di bawah header bila memang pada template kita belum tersedia, bagi yang sudah yah ini tidak dibutuhkan lagi.
Langsung aja tanpa basa basi menuju TKP.


  •     Login ke blog sobat.
  •     Pilih tata letak ( Layout ) lihat dulu .
  •     kemudian ke template lalu Klik edit html, jangan lupa centang Expand Template Widget .

  •     Cari kode yang seperti ini:          ]]></b:skin>
  •     Kemudian tambahkan kode dibawah ini persis diatas code    :    ]]></b:skin>

    #under_header{float:left;width:100%;}

Sehingga letaknya seperti ini :

#under_header{float:left;width:100%;}
]]></b:skin>
  •     Kemudian cari kode seperti ini [ gunakan Ctrl + F untuk mempercepat pencarian ] :

    <div id='header-wrapper'>
    <b:section class='header'id='header'maxwidget="1'showaddelement="no">
    <b:widget id='header1'locked='true'title='nama blog sobat(header)'
    type='header'/>
    </b:section>
    </div>
  • Copy code dibawah ini lalu tempatkan code tersebut tepat dibawah code yang di atas
    code dibawah ini adalah code pembuatan kolom gadgetnya.
<div id='under_header'>
    <b:section class='header' id='underheader' preferred='yes'/>
    </div>
  •     Setelah anda menempatkan code diatas hasilnya akan seperti ini :
    <div id='header-wrapper'>
    <b:section class='header'id='header'maxwidget="1'showaddelement="no">
    <b:widget id='header1'locked='true'title='nama blog sobat(header)'
    type='header'/>
    </b:section>
    </div>


    <div id='under_header'>
    <b:section class='header' id='underheader' preferred='yes'/>
    </div>

  •     Warna merah adalah kode yang harus sobat tambahkan.
  •     Klik simpan 
  •     Kemudian lihat hasilnya melalui tata letak pada layout Template sobat.

Semoga apa yang telah diterangkan di atas akan senantiasa membantu sobat, bila ada hal yang belum dimengerti silahkan kita saling membantu lewat form komentar dibawah .



Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.

Salam Blogger.... !!! .

Me

Admin Rivai Silaban

Share article with : Google+ Facebook Twitter
Di posting oleh : Rivai Silaban Update pada : 3:15 AM

17 comments :

  1. Malam Mas, boleh bertanya-tanya ga?
    ada beberapa ni..
    mohon bntuannya karena templatenya sama..

    1. bagaimana ya mas buat breaking news diatas itu,?

    2. pada sidebar, bagaimana buatnya jdi statis, mksudnya selalu dlam keadaan terbuka. pokoknya seperti sidebar mas, tidak semuanya tertutup gitu..

    mohon bantuannya mas, terimas kasih..

    http://rudihartoyo.blogspot.com

    ReplyDelete
    Replies
    1. Dengan senang hati sob..
      Maaf sob saya terlambat lihat comentnya, mohon dimaklumi...

      1. bagaimana ya mas buat breaking news diatas itu,?

      jwb : Saya sudah membuat postingan mengenai Headline News sob coba di lihat.http://rivai-silaban.blogspot.com/2013/03/cara-membuat-headline-news-di-blog.html

      2. pada sidebar, bagaimana buatnya jdi statis, mksudnya selalu dlam keadaan terbuka. pokoknya seperti sidebar mas, tidak semuanya tertutup gitu..

      Jwb : Oh soal itu sob sebenarnya saya hanya menambahkan kolom gadgetnya dibawah sidebar yang disebelah kanan templatenya.

      Makasih atas kunjungannya....

      Delete
    2. terima kasih suda di respon mas,,,

      untuk no.1 terima ksih, ntar saya coba..:)

      untuk 2, saya udah coba untuk nambah disebelah kanannya, tapi untuk judul gadegtnya gk sama atau tanpa background yang sama?
      apa mas, ada ubah sedikit kode html nya d template mohon bantuannya lagi mas..:)

      Delete
    3. #main-wrapper{padding-top:10px;width:600px;float:left;word-wrap:break-word;overflow:hidden}
      #sidebar-wrapper,#sidebar1-wrapper{width:300px;float:right;word-wrap:break-word;overflow:hidden;padding-top:10px}
      #bottom-col {
      width:300px;
      float:right;
      word-wrap:break-word;
      overflow:hidden;
      }

      Copy script diatas lalu pastekan tepat diatas cript yang dibawah ini #___( Cari Script yang ada dibawah ini )__#

      h2{line-height:1.4em;text-transform:none;color:#333;margin:.5em 0 .25em}
      h3.date-header{text-transform:none;font:normal 12px Arial;color:#999;line-height:1.2em;margin:.1em 0}
      .post{border:1px solid #c4c4c4;margin:0 0 15px;padding:5px 15px 15px}
      .post h1,.post h2{font-family:Arial;font-size:160%;font-weight:700;line-height:1.2em;color:#0a2e56;margin:.0em 0 0;padding:4px 0}

      Delete
    4. Script yang diatas adalah CSS nya sob....
      untuk memanggil script gadgetnya saya sudah postkan di G+ kamu sob, Maklum tag DIV tidak diperbolehkan di coment. bila ada yang masih kurang kita sama sama share lagi sob.
      salam bloger

      Delete
    5. terima kasih bnyak atas ilmunya mas...:)

      Delete
  2. Sama sama sob... !! lanjutkan kreativitasnya...
    salam bloger..

    ReplyDelete
  3. nice artikel gan (y)
    follow balik ya gan http://gaulblog26.blogspot.com/

    ReplyDelete
  4. @anonymous_69
    Makasih gan, setelah saya lihat, blognya terlalu brat gan, kurangi pemakaian widget dan script yang terlalu berlebihan. Terimakasih atas kunjungannya.

    ReplyDelete
  5. terima kasih brother untuk infonya :)

    ReplyDelete
  6. kalo gk ada header-wrapper cara lain.nya gimana

    ReplyDelete
    Replies
    1. gitu ya, pokoknya pada intinya pemasangannya dibawah judul blog, atau diatas widget Blog 1 ( postingan halaman blog )memang terkadang penulisan tidak sama oleh pembuat template tapi setidaknya blog pasti memiliki header, postingan dan footer serta sisi kiri dan kanan.

      Delete
  7. tanya gan, di template saya kodenga tidak seperti

    div -nya

    tapi kodenya seperti ini

    b:includable id='main'

    artinya gak ada div> nya, jd gmn cara nambahnya gan?

    ReplyDelete
    Replies
    1. yang penting di pasang di bawah header memang terkadang kodenya seikit berbeda penulisannya tapi intinya dibawah header blog agan aja

      Delete

1. Komentar SPAM Akan secepatnya dihapus
2. Pastikan untuk " Berlangganan Lewat Email " untuk membangun kreatifitas blog ini
3. Cek komentar masuk sebelum bertanya.
4. Link aktiv tidak akan berpungsi.
5. Dilarang menyebarluaskan artikel tanpa persetujuan dari saya.
6. Untuk mengajukan pertanyaan diluar postingan diatas, silahkan klik " Forum Diskusi "
7. Bergabung dengan kami untuk menjadi member Klik " Join to Member "
8. Komentar yang mengandung code tag HTML, konversikan terlebih dulu silahkan klik " Konversi Kode "

Salam bloger .. !!
Pergunakan semua fasilitas di Blog ini untuk mempermudah anda..
Konversi Kode Forum Diskusi Join to Blog