Sebuah Header bukan saja menunjukan apa nama dan deskripsi dari blog
kita, Header juga bisa menjadi salah satu daya tarik utama sebuah blog
bila kita mampu memaksimalkannya dengan baik. Header yang bagus, unik,
lucu, gokil dan tidak pasaran tentu saja akan membuat pengunjung tertarik dan bisa saja mereka menjadi pembaca setia kita 
.
.
Kali ini kita akan membahas bagaimana cara membuat Header blog yang berisikan Link. Langsung saja tanpa berbasa - basi
Yang kita butuhkan adalah 2 software dan 1 situs yang sudah tidak asing
lagi ditelinga, Adobe Photoshop (atau bisa software photo editor
lainnya), Dreamweaver (Untuk menambah link pada gambar), Photobucket (Untuk media penyimpanan gambar).
1. Pertama - tama buatlah dulu gambar yang akan sahabat jadikan header.
Sebagus dan sekreatif mungkin, dan sesuai dengan selera sahabat . Oh iya, jangan
lupa untuk menyesuaikan ukuran gambar dengan ukuran header sobat,
karena jika tidak sesuai ukurannya maka hasilnya nanti juga kurang baik
(gambar bisa terpotong).
. Oh iya, jangan
lupa untuk menyesuaikan ukuran gambar dengan ukuran header sobat,
karena jika tidak sesuai ukurannya maka hasilnya nanti juga kurang baik
(gambar bisa terpotong).
misalnya saja gambar ini yang akan menjadi header blog saya :
Simpan gambar tersebut dan keluar saja dari photoshop karena kita hanya
membutuhkan photoshop untuk "mengotak - atik" gambar header kita .
.
2. Buka situs www.photobucket.com lalu sign up dan ikuti langkah yang
ada jika sahabat belum mendaftar, jika sudah tinggal klik sign in ->
upload -> select
file from my computer -> pilih file header yang sudah disimpan tadi.
Tunggu proses upload, dan jika sudah selesai maka hasilnya akan seperti
ini :
Perhatikan bagian yang saya lingkari merah itu, nantinya direct link tersebut yang akan kita gunakan.
3. Sekarang kita tinggalkan dulu photobucket dan masuk ke dreamweaver.
Klik File -> New -> HTML -> Klik create. Maka akan muncul
jendela seperti ini :
Letakkan kursor setelah <body>, setelah itu klik insert ->
image -> pilih gambar header yang sudah kita simpan tadi -> bila
ada pilihan klik OK terus saja.
maka hasilnya akan seperti ini :
Lalu klik pada gambar, dan akan muncul rectangular hotspot tool dan oval
hotspot tool pada bagian pojok kiri bawah. Gunakan kedua tools tersebut
untuk menentukan area mana yang akan kita jadikan link.
Misalnya saya menggunakan rectangular
hotspot tool untuk membuat gambar ikon facebook menuju akun facebook
saya. maka caranya klik rectangular hotspot tool -> blok bagian
gambar facebook -> pada kotak link masukkan url alamat yang dituju,
sebagai contoh saya masukkan url yang menuju akun facebook saya ->
pada target saya pilih "_blank" (agar link dibuka pada tab baru) ->
pada alt masukkan kalimat / info yang akan muncul bila kursor diletakkan
diatas gambar yang kita beri link.
4. kalau sudah semua bagian gambar yang kita inginkan diberi link, maka
langkah selanjutnya tinggal menyimpan hasil kreasi kita tersebut.
caranya tinggal klik file -> save as. Nah, hasilnya nanti berupa file
.html, buka file tersebut dengan notepad dan hasilnya nanti akan
seperti ini :
Lihat pada <img src="Untitled-1.jpg"...
nah Untitled-1.jpg tersebut merupakan alamat gambar, ganti
Untitled-1.jpg dengan alamat direct link yang telah kita bahas pada
langkah 2 tadi. sehingga menjadi seperti ini bila saya contohkan milik
saya :
<img src="http://i1070.photobucket.com/albums/u498/starvanzs/headerlink.jpg"....
5. Sekarang kita masuk ke blogger. pada dashboard klik design ->
pada page elements klik add a gadget -> pilih HTML/Javascript ->
Pada content masukkan kode yang ada pada notepad tadi mulai dari <img
src... sampai </map> -> klik simpan
6. Drag widget Header baru yang telah kita buat tadi tepat dibawah header lama yang ingin kita gantikan.
7. Klik Edit pada widget Header lama kita dan pilih remove untuk menghapusnya. Klik save.
