20120203

cara mengubah header 1 kolom menjadi 2 kolom

Ada 3 langkah yang harus anda lakukan untuk dapat mengubah header 1 kolom menjadi 2 kolom

1. Tahap PERTAMA

  • 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 Expand Template Widget 
  • Kalau sudah kita mulai mengobok-ngobok kode html nya 
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;}

2.Tahap 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. 

3. Tahap KETIGA selesai dan simpan templete
Sekarang Lihat hasil nya...langsung anda kerancangan...semoga berhasil ya....jika ada kendala silahkan tinggalkan komentar nya di bawah...

0 komentar:

Posting Komentar

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites