SUHADAHANUM'S: Cara Membagi Kolom Header Blog Menjadi Dua Kolom Templat

Senin, 17 Januari 2011

Cara Membagi Kolom Header Blog Menjadi Dua Kolom Templat

Bagi kita-kita yang lagi belajar ngeBlog, ngutak-atik halaman blog adalah sesuatu yang mengasyikan. Menemukan sesuatu yang baru dari blog teman, selalu menarik minat untuk mencoba menerapkannya pada blog kita. Apalagi pabila yang baru itu memang sedang kita cari, seneng dwehh...

Pada kesempatan kali ini aku pengin coba bagi-bagi sama sobat-sobat yang lagi coba belajar ngeBlog tentang cara membagi HEADER blog menjadi dua bagian. Tentu saja bagi sobat yang pingin mencobanya, ya...bagi yang belum tentunya.

Bagi sobat yang mau mencobanya, silahkan ikuti langka-langkah berikut:

1. Login ke blogger dengan ID sobat sendiri tentu, he..he..

2. Klik Layout.

3. Klik tab elemen Halaman, maka sobat akan melihat tampilan format kolom header anda.

4. Jika sudah di lihat, kemudian klik tab Edit HTML, lihat ke bagian kode CSS, lalu cari kode seperti ini

.header-outer {

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

5. Seluruh Kode tadi aku hapus dan diganti dengan kode 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;}