-->
» » » » Menambah Widgate Horizontal di Bawah Header

Menambah Widgate Horizontal di Bawah Header

on


Cara Menambah Widgate Horizontal di Bawah Header - Selamat sore para sahabatku semuanya, pada kesempatan klai ini bang dadan akan membahas cara menambah elemen/widgate horizontal dibawah header. Tutorial seperti ini, mungkin sudah banyak sekali sobat temukan di blog-blog yang lain khususnya para blogger yang sudah lama dalam menggeluti dunia blog. namun tak ada salahanya juga bang dadan posting lagi, itung-itung sebagai tabungan artikel, bila pada suatu saat nanti kalau saya ingin menerapkan hal ini tidak mesti browsing sana sini lagi. cukup lihat di blog kita sendiri jadi kan lebih enak dan mudah.
Element/Widgate seperti ini biasanya sering di gunakan untuk pembuatan slider gambar, banner iklan, menu navigasi horizontal, dll. sesuai keinginan sobat sendiri dalam menerapkannya.
Oke sob, saya gak akan berlama-lama lagi, sekarang kita langsung pada cara pembuatannya. silahkan simak dengan baik ya??

 Cara Menambah Element Horizontal di Bawah Header

Cara Menambah Widgate Horizontal di Bawah Header
Klik gambar untuk memperbesar
  • Pertama biasa login ya pada blognya masing-masing??
  • Kedua silahkan masuk pada Dasbor / Rancangan 
  • Ketiga Pilih Template ➜ Edit HTML *jangan lupa centang expand template widgate
  • Ke empat cari kode ]]></b:skin> *Alangkah baiknya backup template dulu untuk berjaga-jaga terjadinya kesalahan
  • Kelima kalau sudah ketemu silahkan copy kode dibawah ini, tepat diatas ]]></b:skin>
Berikut kodenya :

/* Slide Content ----------------------------------------------- */ 
 .slide-wrapper {padding:0 auto;margin:0 auto;width:auto;float: left; word-wrap: break-word; overflow: hidden;} 
 .slide {color: #666666;line-height: 1.3em;} 
 .slide ul {list-style:none;margin:0 0 0;padding:0 0 0;} 
 .slide li {margin:0;padding-top:0; padding-right:0;padding-bottom:.25em; padding-left:0px;text-indent:0px;line-height:1.3em;} 
 .slide .widget {margin:0px 0px 6px 0px;}
  • Selanjutnya agar element/widgate muncul sobat harus memanggilnya dengan intruksi sbb:
  • Letakan kode dibawah ini tepat di atas kode <div id='main-wrapper'>.
Berikut kodenya :

<b:if cond='data:blog.url == data:blog.homepageUrl'> 
 <div id='slide-wrapper'> 
 <b:section class='slide' id='slide' preferred='yes'/> 
 </div> 
 </b:if>

  • Silahkan simpan template anda dan Selesai..!! 
  • Sekarang coba lihat pada Dasbor ➜ Tata Letak. Element/Widgate horizontal telah muncul tepat dibawah header sobat.
Catatan* Sobat dapat menempatkan widgate tersebut sesuai keinginan sobat, silahkan ganti kode <b:if cond='data:blog.url == data:blog.homepageUrl'> sesuai keinginan sobat. untuk referensi silahkan klik cara menampilkan widgate dihalaman tertentu.

Mungkin cukup sekian tutorial kali ini tentang Cara Menambah Widgate Horizontal di Bawah Header dan semoga bermanfaat.
Selamat mencoba..!!!
Labels: blogger tutorial, template hack, Widget

Thanks for reading Menambah Widgate Horizontal di Bawah Header. Please share...!

1 Comments on Menambah Widgate Horizontal di Bawah Header

Back To Top