Blog Pribadi: Mengganti Header Blog

Setelah memilih template yang ada, rasanya belum cukup untuk merubah penampilan blog, ada banyak keinginan untuk merubah tampilan blog agar penampilannya lain dari yang lain. Nah ini tulisan saya yang pertama mengulas tentang blog, dan nantikan juga tulisan berikutnya yang akan saya masukkan pada “menu” blog tersendiri.

Sebagai permulaan, akan saya bahas mengganti header blog.

Header bisa dikatakan penting karena gambar yang ada pada header mewakili tema dari blog kita, desain bisa kita siapkan menggunakan Adobe photoshop, Corel Draw, atau GIMP untuk pengguna linux dan lain-lain.

1. Masuk ke Blog anda dengan user dan password anda
2. Buka tab “Template” dan pilih”Edit HTML”
3. Sebelum melakukan eksperiment ini sebaiknya lakukan backup seperti gambar dibawah ini.

simpan file backup tersebut di komputer Anda. Ada baiknya tiap kali akan melakukan eksperiment pada blog lakukan hal yang sama, agar jika terjadi kesalahan tidak merepotkan.

4. Setelah melakukan backup, cari kode "#header-wrapper" seperti dibawah ini, dengan catatan bahwa kode ini saya peroleh dengan menggunakan template "Minima Blue", dan mungkin berbeda jika kita menggunakan jenis template lainnya.


#header-wrapper {
  width:660px;
  margin:0 auto 10px;
  border:1px solid $bordercolor;
}

dari kode CSS diatas bisa kita lihat bahwa lebar gambar untuk header adalah 660 dengan satuan pixel, sedangkan untuk tinggi bisa ditentukan sendiri.

Sebagai contoh, saya telah membuat header seperti gambar dibawah ini dengan lebar 660px dan tinggi 300px.