">

Rabu, 25 Desember 2013

Cara membuat Header Menjadi dua Kolom ( templete Baru)

Do you want to share?

Do you like this story?

Bagaimana sih bentuk header dua kolom tersebut...kira-kira seperti sobat lihat di bawah ini....yang sebelah kiri merupakan header utama yang di potong sedangkan sebelah kanan header hasil potongan...ada keuntungan yang bisa kita ambil dengan adanya dua klom header ini mungkin kita bisa meletakan tulisan,gambar,maupun kode script di samping judul blog kita..


Di dalam postingan ini header yang akan di modifikasi adalah untuk blog yang memakai templete baru jika templete sobat memakai templete lama silahkan baca artikel selanjut nya di sini.

Jika sobat berminat untuk membelah header cara nya ga terlalu ribet cukup bawa pisau dapur atau celurit terus di belah bereskan..!!! he he sorry bercanda juragan....

Ok..!!! kita langsung aja mengikutin tahapan-tahapan nya...

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
  • 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

Tidak ada komentar:

Posting Komentar

Contact Us About Us Privacy Help Redaksi Info Iklan F A Q