Cara membuat Header Menjadi dua Kolom ( templete Baru)

Sebagaimana pada postingan sebelumnya cara membuat header untuk blog templete lama sudah dibahas langkah-langkahnya, kali ini dibahas tentang cara membuat header untuk blog templete baru.

Berikut langkah-langkahnya:
1.Tahap Pertama
>Login ke account blog anda
>Klik Rancangan ->Edit HTML
>Jika takut rusak Download template anda terlebih dahulu
>Klik Expand Template Widget

>Cari kode dibawah, cara cepat 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;}

Setelah ketemu hapus seluruh kode di atas dari tanda awal ( / ) sampai tanda akhir ( } ), ganti (replace ) dengan kode berikut:

.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 Berikut:

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

Kemudian anda tambahkan dengan kode berikut:

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

Hasilnya seperti layout dibawah:

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

3.Tahap Terakhir
Simpan Template -> Lihat Blog

Sekian artikel berjudul Cara membuat Header Menjadi dua Kolom ( templete Baru), Semoga bermanfaat. URL artikel: http://javablogtrik.blogspot.com/2012/03/cara-membuat-header-menjadi-dua-kolom_21.html

Artikel Terkait: