03 May 2007

ADD FAVICON

ADD FAVICON [MENAMBAH FAVICON DI BLOGSPOT]

Blog saya kedatangan seorang pengunjung dari Malaysia. Namanya Irfan Jani. Sebagai balasan atas kunjungannya tersebut saya pun berusaha mengintip jeroan dari blognya: Irfanreka. Dan saya mendapatkan pelajaran bagus dari blog itu. Yaitu membuat Favicon. Apa itu Favicon? Yang saya kotakkan dengan warna hitam pada gambar dibawah ini adalah Favicon.






Mengutip dari blog Irfan:

***
Apa yang anda lihat di atas adalah dinamakan sebagai “Favicon”. Apakah fungsinya?

Jika dilihat secara kasar, ia hanyalah hiasan ikon pada alamat web sahaja. Realitinya, ia sebenarnya adalah simbol/logo yang akan memudahkan sesiapa sahaja untuk mengingat jenama anda apabila menanda (bookmarking) halaman milik anda. (hanya drag ikon itu dan bawa ke bahagian Tab).

Fungsi Favicon hanya terdapat pada Pelayar Musang (Firefox..hehe) dan Internet Explorer 5+ dan ke atas Sahaja. Tapi, siapa tahu akan datang semua pelayar akan turut serta, kan?

***

Saya memakai Opera sebagai perambah (browser) dan untuk saya pasang di blog saya di Blogspot. Ternyata bisa memasang fungsi Favicon terebut. Dan tak perlu muluk-muluk Anda harus mempunyai Adobe Photoshop untuk mengolah gambar menjadi berformat ico. Saya memakai paint bawaan Windows juga bisa (sebagaimana saran dari Irfan juga). Oke tanpa berpanjang lebar saya akan memberikan ilmu dan pengalaman saya yang memang sedikit ini kepada Anda semua. Tapi sebelumnya alangkah lebih baiknya Anda membaca dulu blognya Irfan tersebut. Selamat mencoba.

1. Pertama Anda buka Program Paint di Accessories.
2. Open file pilihan Anda. Saya memilih gambar daun.
3. Buat ukuran file tersebut menjadi 16 x 16. Caranya buka: Image – Stretch/Skew.
4. Isi di pilihan Stretch, untuk horizontal dan vertikalnya dengan angka 16. Tekan OK.
5. Lalu Save As, pilih Save as Type: PNG agar tidak ada ketajaman warna yang berkurang. Lalu beri nama apa saja dengan membubuhkan titik dan huruf ico dibelakang nama file tersebut. File saya diberi nama daun.ico.







6. Save.

Sekarang saatnya untuk menampilkannya diblog kita.
1. Upload file tersebut di blog kita. Bisa di sidebar atau di dalam postingan blog kita. Saya memilih untuk menampilkannya di postingan blog saya.
2. Kemudian catat alamat favicon itu dengan mengklik kanan lalu pilih properties. Alamat file saya ada di:


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGji65boOLfO4eyfWt14MgQowJ_gIOTn1KlNRyAGq-3bQQPRPpmQZL7NoOmWHAOUnfBLEEXdsQZQWLO6vJPMRwqAYufjSt6liir7erFvYV-eduwRK71_ft1VL7W5dil0zUlqL1hQm7ZL9c/s200/Daun.ico


 




3. Edit HTML blog Anda dengan memasukkan kode ini:

<link
rel="shortcut icon" href="[alamat ico]" mce_href="[alamat ico]"
type="image/x-icon" />




4. Ganti [alamat ico] dengan alamat favicon pada poin dua di atas.
5. Menaruh kode tersebut di bawah

<HEAD>



6. Lalu save/simpan hasil edit HTML Anda.
7. Silakan lihat blog Anda sekarang. Favicon tersebut sudah muncul di Tab atau jendela browser Anda.

Wait the minutes...I’ll try to look my blog with other browser. Yes, Opera. It’s work.
And Mozilla, It’s work too. But, in IE, nothing happen. I do not know.
Tapi tidaklah mengapa. Yang penting ini berhasil.

Terimakasih kepada Irfan atas ilmunya.


Riza Almanfaluthi
dedaunan di ranting cemara
Kalibata masih sunyi
09:23 03 Mei 2007

1 comment:

Anonymous said...

Kenapa di IE tidak muncul? Itu karena yang Riza buat bukan file ico yang sebenarnya, tetapi file png yang diubah ekstensinya. Coba gunakan pengolah citra yang mampu menyimpan file sebagai file icon seperti Irfan View, atau gunakan peralatan online seperti yang pernah saya sebutkan di
http://maseko.com/2005/08/08/menggunakan-favicon/