Cara Membuat Icon / Favicon Pada Blog atau Website

Kali ini saya akan membuat posting tentang cara membuat dan mengganti icon (favicon) blog. Bagi yang belum tahu sedikit saya jelaskan Favorit Icon atau yang disingkat Favicon adalah sebuah gambar kecil di address bar. Terletak disebelah kiri nama blog ataupun judul posting blog yang sedang kita buka. favicon bawaan blogspot biasanya dilambangkan dengan huruf B dalam kotak berwarna orange.

Mungkin agan blogger lagi bosen dengan icon bawaan blogger atau blogspot yang berbentuk huruf B, nah biar gag bosen mendingan agan bikin icon (favicon) sendiri deh, plus memasang icon tersebut di blog agan sehingga bisa tampil di address bar. 

Langsung saja ya gan, berikut langkah-langkahnya : 

1. Masuk ke www.genfavicon.com  atau ke  http://www.html-kit.com/favicon/ 
2. Buat favicon di  situ. sebagai contoh saya akan membuat favicon di genfavicon.
3. Masukkan gambar baik lewat url gambar ataupun menguploadnya (disini saya menguploadnya) lalu Klik Upload image
4. Jika sudah diupload bisa Select Size untuk menentukan ukuran gambar atau juga memotongnya/crop (crop & preview) sesuai tampilan yang kita inginkan.
5. Download favicon Image. Lalu upload ke hosting gambar, disini Saya menguploadnya ke google code. Jika agan mau tau cara membuat file hosting image, javascript maupun dokumen lain di google code termasuk menyimpan gambar favicon silahkan kunjungi postingan cara membuat file hosting di google code.

6. Apakah sudah selesai? belum, untuk segera menampilkannya pada address bar dengan cara buka Template > edit HTML > centang expand template, cari kode </head> dan letakkan kode berikut dibawahnya :

<link href='http://ddito.googlecode.com/files/favicon.png' rel='icon' type='image/x-icon'/>

Pada kode berwarna merah diatas, adalah alamat saya menyimpan/hosting gambar favicon blog ini. Setelah itu agan Save.


7. Langkah terakhir agan masuk ke Tata Letak > edit Favicon > uploud image tadi dan setelah itu Save. Untuk melihat hasilnya agan restart firefox ato google chrome dan setelah itu Favicon sudah berubah seperti yang agan inginkan.

Nah bagaimana sobat sudah berhasil mengganti faviconnya, terlihat lebih profesional, keren dan ... bagus khan?  Apabila agan ada pertanyaan, silahkan comment dibawah nanti pasti akan saya jelaskan.


Selamat Mencoba..!!