Favicon itu apa sih? Pertanyaan yang pertama kali timbul saat saya mendengarnya. Jawabnya, itu adalah icon kecil yang berada di address bar sebelum tulisan http://bla-bla[dot]com dan juga ada di tabulasi browser (jika mendukung tabulasi).
Jadi kalau kita melihat, contoh yang gampang kita buka saja google.com, pasti akan ada gambar hijau merah ciri khas google sebelum alamat url nya. Itulah yang disebut favicon.
Kita juga bisa lho membuat favicon sendiri, tentunya dengan ciri khas kita. Caranya juga gampang banget kok.
Berikut ini sedikit informasi yang bisa saya berikan soal membuat favicon.
1. Buat gambar dengan ukuran maksimal 100 x 100 pixel. Kalau tidak bisa bikin kayak saya, cari aja gambar yang bagus dan pas trus edit/crop.
2. Gambar sudah siap, kini kita convert gambar tadi jadi file .ico . Tidak punya converter? Jangan takut, ada converter online kok. Langsung saja ke http://www.animatedfavicon.com/ . Disini kita bisa buat animated favicon. Tinggal upload dan download file yang sudah jadi. Isi file yang kita download ada beberapa, diantaranya favicon.ico dan animated_favicon.gif . Kedua file ini yang harus kita upload ke image server, atau ke media galery kita.
3. Sekarang buka theme editor. Yang paling mudah lewat dashboard. ( Tetapi pastikan sebelumnya folder theme sudah di ganti permissions nya ke 777 – writeable ). Buka file header.php, dan masukan kode berikut di antara <head> dan </head>
Untuk normal favicon (bukan animasi)
<link rel=”shortcut icon” href=”lokasi favicon.ico kita”>Untuk animasi favicon
<link rel=”shortcut icon” href=”lokasi favicon.ico kita” >
<link rel=”icon” href=”lokasi animated_favicon.gif” type=”image/gif” >
4. Save dan lihat hasilnya … :yahoo:
5. Selesai dan silahkan jika berkenan memberikan beberapa patah kata di bawah ini :mail:
{ 10 comments… read them below or add one }
pertamaaaxxx sekalian menyampaikan patut saya coba Mas.
Selalu ada yang baru disini infonya. Trims banget.
Salam :)
Hmmm, saya malah baru tau…
Kirain sama aja, ternyata beda cara editnya…
Thx mas :)
Zippy´s terakhir menulis di blog ..Flash Disk Mirip Peluit
@arkasala
@zippy
your wellcome ….
senang rasanya jika bisa berbagi informasi yang bermanfaat …….
Kok blog ini faviconnya nggak animasi?
marsudiyanto´s terakhir menulis di blog ..Facebook, FreeCell, FaceBrooke dan FreeShield
@marsudiyanto,
masa sih … animasinya cuma scroll aja mas …
di browser saya jalan kok …
aneh ya …. apa mungkin pada beberapa browser gak jalan? sy blm cek di browser lain sih, cuma di chrome memang tidak timbul faviconnya …
@marsudiyanto,
iya, saya lihat di opera juga gak jalan, kenapa di mozilla-nya normal ya .. ?
aneh …. :scratch: :unsure:
hpnugroho´s terakhir menulis di blog ..How to Upgrade your Wordpress
salam knall
bagus blog nya nya
kamisama´s terakhir menulis di blog ..Mutiara
@kamisama,
terima kasih,
salam kenal juga …
punya ku kok nggak bisa mas?
@elfaridi,
,
kelihatannya ada kesalahan code ..
sy lihat di blog mas/mbak
codenya :
<link type=”image/gif“ href=” http://y41k.fileave.com/animated_favicon1.gif “ rel=”icon“/> …
coba lihat dgn yg saya contohkan diatas :
<link rel=”shortcut icon” href=”lokasi favicon.ico kita” >
<link rel=”icon” href=”lokasi animated_favicon.gif” type=”image/gif” >
sy lihat ada satu bagian yg hilang (yg tercetak miring) dan tanda kutip (” “)yang dipakai menggunakan spasi,
coba tambahkan kode diatas, copy/paste saja dan ubah lokasi imagenya (akan lebih baik diupload di media file saja) …
jgn lupa kedua image yg dibuat dari animatedfavicon.com diupload semua ..
oya, tdk semua browser bisa menampilkan animasinya …
semoga membantu