26 Desember 2010

Design Template: Header dua Kolom

Kembali saya sharing tentang Design Template, setelah kemarin saya sharing tentang Blogger Tricks dan menulis artikel tentang Blogger Indonesia Dukung Internet Aman, Sehat & Manfaat. Nach, kali ini tutorialnya focus pada header dan tepatnya membagi header menjadi dua kolom

header dua kolom
Fungsinya adalah untuk menambahkan widget pada header blog anda, disana anda bisa meletakkan artikel-artikel terpopuler anda, menambahkan pesan khusus yang disampaikan kepada pengunjung anda, atau meletakkan iklan bagi yang suka monetize blog.
Berikut tutorialnya:
  • Login ke Blogger.com
  • Kemudian Tata Letak
  • Pilih Edit HTML
  • Centang Expand Widget
  • Backup dulu template anda untuk berjaga-jaga bila terjadi kesalahan bisa dikembalikan seperti semula
  • Percobaan saya pada template Minima yang memiliki lebar header-wrapper 660px
lebar header-wrapper template minima
  • Setelah itu, ganti lebar header menjadi 360px dan float menjadi left
  • Sekarang buat kode untuk header kedua yaitu disebelah kanannya float:right
#header2 { float:right; width:250px; }
  • Kemudian Copas dibawah kode header pertama
  • Selanjutnya Copas kode berikut dibawah </b:section> pada <div id='header-wrapper'> seperti berikut:
Kodenya:
<b:section class='header' id='header2' maxwidgets='1' showaddelement='yes'/>
Hasilnya:
  • Setelah itu, Save Template anda..

0 komentar:

Posting Komentar