[SHARE] Header Ber-Link, Cekidot

Assalamuallaikuumm, guyss.. :) Alhamdulillah.. Sebelum pulsa internet harian ku habis. Sempatkan aku nulis sebuah cara/tutorial. Ini request dari temenku blogger namanya Bang Fian Syauqi. Mungkin ini gak cuman bermanfaat buat dia, tapi juga semuanya. Sebenernya trik ini hasil aku search di google dan langsung aku praktekkan ternyata sukses. Hehehe syukurlahhh :D

Nah.. Ndak usah lama lama, guys. Yang kalian perlukan adalah:

  

1. Internet (buat download Adobe Dreamweaver CS5, kalau sudah punya gak perlu internet) hehe :)
2. Listrik, guys :)
3. PC/Laptop dan sejenisnya :)
4. Adobe Photoshop & Adobe Dreamweaver (terserah mau CS berapa, kalau bisa buat photoshop CS3 keatas dan Dreamweaver CS4 keatas)
5. Mouse(bukan tikus) Kalau PC perlu mouse, kalau laptop boleh-boleh saja pakai mouse :)
6. Ketelatenan/kesabaran
7. Camilan dan minuman (jaga-jaga kalau tenggorokan garing) :)
8. Obat mata (jaga-jaga kalau mata pedes di jalan) :)
9. Tutorial (untuk kalian yg belum tau, dan tau tapi sedikit lupa) :)
10. Jika ada yg diperlukan selain di atas tambahi saja :) gak apa-apa :)
11. Dll.

Sepertinya itu saja yang diperlukan buat melaksanakan tugas membuat header ber-link :)

Langkah-langkah yang harus dilangkahi sebagai berikut, guys :)

(Keadaan PC/Laptop sudah ada Adobe Photoshop dan Adobe Dreamweaver)
1. Kalian harus bikin konsep header yg mau dibikin. Dimanapun medianya :) mau digital atau non-digital :)
2. Ukuran header diperhatikan :)
3. Jika, yang kalian bikin sudah fix akan jadi header. Meluncurlah ke Adobe Dreamweaver (Ketika tampilannya muncul seperti di bawah, pilih HTML dan setelah itu tampilan pada editor dengan ciri kosong,putih dan lebar :D)

4. Nah. Setelah itu tekan Ctrl+Alt+I(kalau gak salah sih :D) buat masukin gambar yang kalian bikin tadi. Atau pilih Insert > Insert Image :) Lalu muncul seperti yang di bawah ini. Itu ndak usah diisi apa-apa langsung klik OK :) Jangan khawatir :)

5. Setelah gambar muncul. Perhatikan yang aku beri tanda di pojokan :) itu bagian awal dari tugas ini :D itu buat bikin area(Map) yang akan diberi sumbangan link.

6. Nah.. Ini contohnya bikin area-nya :) gambar pointer di pojokan itu fungsinya ngatur kembali titik poly itu :) Trus agar berfungsi sbg link kalian harus mengisinya dengan bensin link :) buat contoh dan sekalian promo itu twitterku aja :D target isikan _blank saja :) nanti bisa diedit kok. Di notepad/HTML/JavaScript. Tenang saja :) Trus Alt itu kosongin aja :)

7. Setelah maping/meng-area-kan selesai. Kini save. Ndak perlu ada yang dirubah, guys :)

Caranya buat dipasang di-blog yaituuuuu .... *jeng jeng jeeng*

1. Buka hasil save dari dreamweaver tadi :) lalu open with > notepad (jika, saat open with gak ada notepad klik choose default program)

2. Dan inilah hasilnya :) karena aku maping cuman bagian twitter, jadi ya cuman itu saja :) Kenapa itu harus dihapus?? Karena itu mengganggu. Soalnya pengalaman pada aku sendiri. Itu lupa gak aku hapus. Kan di HTML/JavaScript gak aku kasih judul, tapi kok masih ada judulnya. Mungkin kalian tertawa, aku sampai cari di google ._. omegaattt.. Trus buat yang aku blok itu ganti dengan link gambar kalian yang sudah diupload di berbagai tempat, aku makai photobucket :) yang lain juga bisa kok. Seperti, imageshack, blogger, yfrog dll :)

3. Setelah itu selesai dilaksanakan. Masuk blogger > rancangan > elemen laman > add gadget > HTML/JavaScript
Beginilah penampakannya :)

Kenapa Header-nya gak ada??

Headernya aku sembunyiin :) Bisa kok dicari di google :)

Trus di elemen lamanku kok gak ada "Tambah Gadget/Add Widget" seperti punya lo?

Oiya? Seius? :O:/Alhamdulillah aku dulu sudah ada :) Jika gak ada jangan khawatir, insyaallooh ada kok nyari  tutornya di google.

4. Copy kode yang di notepad tadi yang sudah di tambahi link gambar dan sudah dihapus tittle-nya ke dalam HTML/JavaScript
nb: Buat yang ingin nambah seperti di header-ku (coba arahkan kursor kalian ke salah satu link, muncul sesuatu kan? Contohnya Twitter lagi ajadeh :) arahkan ke situ dan muncul "Follow Me on Twitter" Nah, baiklah.. Itu caranya tinggal nambahin title="KALIMAT SESUAI KEINGINAN KALIAN :)" Letakkan sebelum target="_blank" oiya..sekalian jika ingin ngedit bagian target bisa di situ :)

5. Save :)

Begitulah yang dapat aku share ke kalian, guys :" semoga bermanfaat yaa :" jika kurang jelas jangan malu monggo ditanyakan dengan jelas-sejelasnya :D Jika aku bisa menjawab aku jawab, kalau tidak dengan jujur dan mohon maaf aku tidak dapat menjawab ^^