Cara Membuat Header dengan Iklan 728 x 90 di Blog

Written by Noval Bintang on 03.13 , Labels TemplateTutorial

Oke, kembali lagi dengan saya. Sudah bosan kah? Hehe. Ini merupakan tutorial kelanjutan dari tutorial "Cara Mandiri Membuat Template Blog Sendiri" Pada tutorial sebelumnya saya hanya memberikan template dasar dan pendahuluan untuk membuat template yang paling dasar. Sebelumnya, anda harus keluar dari template editor kemudian masuk kembali ke template editor agar memastikan widget blog / artikel sudah muncul di template.

Kita lanjut membuat template dari atas, ke bawah, dan dari luar ke arah dalam bagian template. Sekarang kita akan belajar cara untuk membuat header blog dengan mendukung iklan 728 x 90 px di blog. Disini saya juga akan memberikan tips-tips yang semoga bermanfaat untuk anda yang ingin membuat template.

Karena sebelumnya saya memberikan template dengan #wrapper berukuran 1000px, maka untuk membuat iklan dengan ukuran 728 x 90 px maka kita tambahkan saja menjadi 738 x 100 px. Loh kok ditambah 10px? Yap, 10 px nya itu untuk jarak antara widget dengan kulit luar element (padding). Jadi, di sekitar gambar iklan tersebut ada jarak 5px antara kulit element. Untuk melihat jelasnya, saya berikan gambar contoh. 

Nah, di gambar atas tersebut pada iklan lazada di antaranya ada padding 5px. Gambar yang berwarna hijau kekuning-kuningan merupakan padding. Sekarang untuk membuatnya 2 kolum kita akan membagi ukuran untuk header yang kiri. Karena header kanan (iklan) berukuran 738px, makan header yang kiri berukuran 1000 - 738 px = 262px. Sebelumnya kita buat dulu CSS untuk membungkus header, anggap namanya #header-wrapper.