Thursday, March 15, 2012

Cara Membuat Header Menjadi Dua Kolom

Cara membuat header menjadi dua kolom sangatlah mudah , sobat tinggal copas kode - kode di bawah selesai. Asal sobat ikuti sajah perintahnya gak bakalan galat. Cara membuat header menjadi dua kolom ini menurut terbaru5 blog penting makanya di simpan di sini karena  nanti butuh lagi dan gak sulit cari kesana - kemari di paman google.
Cra membuat header menjadi dua kolom yang terbaru5 blog tulis sudah di uji coba dan berhasil 100 %, oke langsung sajah ya sob.
  • Seperti biasa anda login terlebih dahulu..kalau sudah login silahkan langsung ke RANCANGAN
  • Anda klik Edit HTML
  • sebelum nya anda download dulu templete agar jika ada kesalahan templete anda bisa di kembalikan seperti semula.
  • Jangan lupa di centang
  • Kalau sudah kita mulai mengobok-ngobok kode html nya
PERTAMA :

CARI KODE DI BAWAH INI..!!! cara cepat nya tekan ( Ctr + F pada keyboard ) fokus pencarian pada huruf bercetak tebal.




.header-outer { background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;}

anda hapus kode di atas dan ganti ( replace ) dengan kode di bawah ini...




.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;min-height: 154px; /* untuk mengatur tinggi header (height) */}
#header {
width: 45%; /* untuk mengatur lebar header kiri - title, description, image */
margin-right: 10px;float: left; }
#bgsGR_headerkanan {
float: right;
width: 49%; /* mengatur lebar header kanan */
margin: 20px 10px 5px 10px;
padding: 2px;}
#bgsGR_headerkanan .widget {margin: 3px;}


KEDUA :

Cari kode di bawah ini


<div class='region-inner header-inner'>

Terus anda tambahkan dengan kode di bawah in...


<b:section class='bgsGR_headerkanan' id='bgsGR_headerkanan' maxwidgets='1' showaddelement='yes'></b:section>

Hasil nya kayak di bawah ini..


<div class='region-inner header-inner'><b:section class='bgsGR_headerkanan' id='bgsGR_headerkanan' maxwidgets='1' showaddelement='yes'></b:section>

CATATAN :
  • Untuk yang bercetak tebal merupakan kode yang di tambahkan tambahan 
  • Untuk yang bercetak merah angka nya bisa anda bisa ganti dengan angka 2,3,4 atau lain nya..maksud nya untuk susunan kolom kebawah. 
KETIGA :
selesai dan simpan templete, begitu trik atau cara membuat header menjadi dua kolom. Sekarang Lihat hasil nya.

No comments:

Post a Comment