Memudahkan Akses di Header Rhjfox | Stra_Rhjfox#26

Terdapat dalam Strategy / Elisitasi pada Stra_Rhjfox#26 Disini

Permasalahannya :

Melanjutkan Strategy / Elisitasi pada Stra_Rhjfox#25 Disini,saya akan menempatkan Memudahkan Akses di Header rhjfox Strategy / Elisitasi pada Stra_Rhjfox#26 Disini. Awalnya Stra_Rhjfox#26 masih berhubungan dengan Stra_Rhjfox#25 , Saya membuat push rhjfox disemua PC sebagai startup homepage untuk diberbagai browser, agar tidak membuat orang jengkel langkah yang diambil yaitu terhubungnya header agar lebih terlihat strategis saat seseorang membuka rhjfox dapat bisa langsung terhubung ke TPi, & ke Google. Langkah dari penelusuran saya, Apakah bisa logo yang sudah digabung dalam header rhjfox dapat ter-link ? Penelusuran saya, kembali mencari tahu untuk melakukan percobaan terhadap header yang dapat ter-link tersebut.

Pemecahan Masalahannya :

Dari penelusuran yang saya dapatkan, bahwa header yang ditambahkan dengan gambar untuk suatu web, atau forum dapat ditambahkan dengan Link dengan menggunakan Adobe Dreamwever CS5, Backup Gambar header yang saya simpan didalam Laptop saya, Jika gambar header yang ingin saya berikan link telah selesai, silahkan save dengan format .png. Untuk contoh diatas hanya ada tiga menu di gambar header yang saya buat untuk di berikan link, anda juga bisa menggunakan satu menu atau lebih tergantung dari kebutuhan anda. Buka Adobe Dreamweaver. Setelah Dreamweaver terbuka silahkan anda pilih HTML.

Selanjunya tampilan Dreamweaver anda seperti dibawah ini;

Pada menu bar, klik Insert > Image atau saya juga bisa menekan Ctrl+Alt+I. Setelah itu masukkan gambar header yang tadi saya buat.
Cat: jika anda menemukan pop up seperti dibawah ini, klik saja OK dan klik lagi OK.

Setelah saya selesai memasukkan gambar maka tampilannya akan seperti dibawah ini;

Perhatikan bagian bawah pada Menu Properties. Ada kotak, bulat dan poligonal silahkan gunakan salah satu tools tersebut untuk menentukan bagian gambar header yang ingin saya berikan Link.

Untuk contoh saya menggunakan tool kotak, silahkan gunakan tools untuk menentukan bagian gambar mana yang ingin saya berikan Link, bagusnya jika saya sesuaikan dengan menu yang saya buat. Tools ini nanti berfungsi untuk memberikan Link pada menu di gambar header yang saya buat tadi. Perhatikan gambar dibawah ini;

Ket:
A = Adalah gambar yang sudah saya tandai menggunakan tools untuk diberikan Link
B = Masukkan Link yang ingin saya tuju
C = Pilih target Link, "_blank" jika anda ingin Link yang dituju saat di klik terbuka di tab baru dan "_self" jika saya ingin Link yang dituju saat di klik terbuka di tab yang sama
Cat: Sampai disini hanya satu menu di bagian gambar yang sudah saya berikan Link, jika di Gambar Header saya lebih dari satu menu silahkan ulangi langkah di atas mulai dari kalian menentukan bagian gambar yang ingin kalian berikan Link untuk menu selanjutnya.
Setelah semua menu yang saya buat di gambar header telah saya berikan Link atau telah selesai, selanjutnya Save header dengan format .html.

Klik 2x file header.html yang tadi saya save dan lihat hasilnya. Seperti itulah nanti yang akan tampil di Header, periksa bagian menu di gambar yang saya berikan Link. Apakah sudah sesuai dengan yang anda inginkan atau belum.
Selanjutnya klik kanan file header.html dan Open with > Notepad. Perhatikan gambar dibawah ini.

Ket: Dalam lingkaran merah adalah alamat Gambar Header yang ada di Laptop saya, tapi gambar itu belum ada di internet, jadi yang harus saya lakukan adalah meng-upload gambar tersebut ke internet. Rinfoto
Setelah saya selesai upload gambar header, ganti alamat gambar yang tadi dengan alamat gambar yang saya telah upload ke internet.

Copy kode mulai dari "<img src= sampai </map>". panjang atau pendeknya kode yang akan anda Copy tergantung dari banyaknya Menu di gambar yang anda buat.

". panjang atau pendeknya kode yang akan anda Copy tergantung dari banyaknya Menu di gambar yang anda buat.

Kemudian, Gambar tersebut saya Upload di Filezilla di bagian folder style, kemudian saya mengupload nya dibagian Theme - Spring Theme (tema yang sekarang rhjfox gunakan) kemudian gambar Header yang lama saya buat menjadi Backup, saya menggantinya dengan "logo.gif" didalam Fillezilla tersebut.

Setelah itu masuk ke Rhjfox dan klik tab "Style" > klik tab "templete" dan pilih "edit & saya memilih Overall_Header dan paste kode yang tadi anda copy dibagian

<div id="logo">
</div>
Script yang saya copy tersebut saya sisipkan diantara <div id="logo"> script ></div>.

Tampilan Header rhjfox Lama

Tampilan Header rhjfox Baru

Mendapatkan revisi kembali dalam Stra_Rhjfox#26 mengenai Header Rhjfox, letakan logo TPi yang sangat peting yaitu di Rinfo, agar lebih mudah untuk melakukan yang pekerjaan kita :) dan dalam Header tersebut sudah terupdate kembali tampilan header Logo Rinfo nya dipaling depan, karena kita melakukan aktivitas semuanya menggunakan Rinfo :)

Header Tampilan Rhjfox Before

Header Tampilan Rhjfox After

Untuk dapat melihat Header terbaru Rhjfox, kalian dapat klik link berikut ini : http://rhjfox.com/Coba, klik dibagian logo-logo tersebut, dan untuk melihat WHY Rhjfox ? bisa klik Logo di bagian Header tersebut :)
Sampai terkejutnya saya ketika teman saya Yudi Prastiawan mengatakan seperti ini :

"ane baru tau, caranya seperti begini gambar header bisa di banyak Linknya ? kenapa gak dari dulu aja kepikiran seperti ini. dan bagus juga dijadikan artikel. dan ane mau nerapinya juga di Web pribadi ane" padahal bisa dibilang, teman saya lebih pintar dari saya, saya juga kaget bahwa dia baru tau menggunakan cara seperti yang saya lakukan untuk header rhjfox tersebut.

NB : logo logo TPi & Google yang terdapat didalam Header rhjfox, dapat langsung diklik dan langsung diantarkan ke tempat tujuannya :)

Ecy Frecilia.blog

Hello Guys !!

Pages

My Profil

My Project

Calender

Clock

Blog Archive

Sabtu, 01 November 2014

Memudahkan Akses di Header Rhjfox | Stra_Rhjfox#26

0 komentar:

Posting Komentar