Saturday, August 28, 2010

Membuat Favicon Muncul di Browser Google Chrome

Sebenarnya membuat favicon tidak sesulit yang dikira, favicon adalah gambar/icon pada address bar. Coba anda perhatikan disamping addressbar. Ada gambar atau icon kecil disana, itulah yang disebut favicon.
Bagaimana cara membuatnya ? cara membuatnya tidaklah sesulit yang dikira. Anda hanya perlu membuat icon atau gambar anda. Biasanya favicon berukuran 25x25 px tapi anda bisa melebihi ukuran itu yang terpenting jangan terlalu besar. Di bawah 50x50 px saja, karna tidak akan muat untuk ukuran favicon, tidak percaya ? buktikan saja. hehe

Script penulisan favicon seperti ini.
<link href='URL GAMBAR ANDA' rel='SHORTCUT ICON'/>

(teks yang diberi warna biru adalah url gambar anda)
Bagaimana cara mendapatkan url gambar ? cara mendapatkan nya anda bisa upload di image hosting.
Saya memakai photobucket untuk image hosting. Klik di sini untuk ke photobucket.com.
Anda perlu mendaftar dulu disana, selesai mendaftar anda langsung upload gambar atau icon anda yang ingin di jadikan favicon setelah selesai upload ambil "Direct Link" nya.  Sementara copy paste kan di notepad dulu.
Memasukan link yang tadi anda ambil di taruh di script di atas. Contoh saya memakai link icon saya.
<link href='http://i959.photobucket.com/albums/ae80/barboz_228/yyty.gif' rel='SHORTCUT ICON'/>

Gampang kan ? lalu dimana saya harus meletakkan nya ?

Anda letakkan di tag head, atau ingin lebih gampang nya taruh di atas </head>.
contoh :
<link href='http://i959.photobucket.com/albums/ae80/barboz_228/yyty.gif' rel='SHORTCUT ICON'/>
</head>


Script ini hanya work pada browser mozilla, coba anda buka blog anda dengan browser google chrome, script ini tidak akan work. Yang muncul hanya icon blogger di blog anda. Untuk bisa bekerja di google chrome scriptnya agak berbeda. Mari saya contohkan..

untuk bisa work di google chrome berikut scriptnya :


<link rel="icon" type="image/gif" href="url gambar anda">


teks yang diberi warna adalah link gambar atau icon anda. Caranya sama seperti di atas. 




Semoga Bermanfaat !

0 comments:

Post a Comment