Kamis, 06 Agustus 2009

211. Kolom Dibawah Header Pada Magazine Template 2

Jika sebelumnya kang Rohman telah membuat tutorial tentang , maka pada kesempatan kali ini mencoba alternatif lain yaitu membuat kolom dibawah kolom header. Ini tentunya berguna bagi anda yang suka menyimpan iklan langsung di bawah header.
Jika menilik pada desain asli magazine template 2, maka anda tentu saja tidak dapat menyimpan iklan atau apa saja langsung di bawah header. Berikut desain asli dari :
kolom-bawah-header_03

Dan kita akan membuatkan kolom baru yang langsung berada di bawah kolom header, berikut contoh ilustrasi dari penempatan iklan langsung di bawah kolom header :
kolom-dibawah-header_03

Tertarik ingin membuat kolom langsung di bawah header? berikut adalah cara lengkapnya :
  1. Silahkan login ke Blogger dengan ID anda.
  2. Klik Tata Letak
  3. Klik tab Edit HTML.
  4. Klik tulisan Download Template Selengkapnya.
  5. Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula.
  6. Cari kode ]]></b:skin>.
  7. Copy paste kode berikut persis di atas kode  ]]></b:skin>.
    .adscolumn{
    width:933px;
    padding:10px 3px;
    background:#fff;
    margin:5px 10px 0px 10px;
    text-align:center;
    border:1px solid #C0C0C0;
    }
    .adscolumn .widget{
    }


  8. Lihat ke bagian bawah, lalu cari kode berikut :
    <div id='main-wrapper'>


  9. Copy paste kode berikut persis di atas kode <div id='main-wrapper'> :
    <b:section class='adscolumn' id='adscolumn' preferred='yes'/>


  10. Klik tombol SIMPAN TEMPLATE.


  11. Selesai.


Langkah selanjutnya, silahkan klik tab Elemen Halaman, maka anda akan melihat tata letak template menjadi seperti contoh gambar berikut :
layout

Sekarang anda sudah bisa memasukan apa saja langsung di bawah kolom header.  Selamat mencoba!
Jangan lupa juga untuk mengunjungi para sponsor Blog Kang rohman yang ada di bawah kolom header serta di bawah posting ini agar kang Rohman rajin membuat tutorial baru !


Copy paste dari: Kang Rohman

0 komentar:

Posting Komentar

Kembali ke atas

Kembali ke atas