JavaProject: Customising your website's Icon in IE5. Free source code and programming help

Report Article

Discuss

Send to a friend

59 votes for this Article.

Popularity: 8.12 Rating: 4.58 out of 5

Introduction

It's always nice to differentiate your site from others, and there a couple of places in particular that allow you to make your site stand out from the crowd.

Dragging a URL from the address bar of Internet Explorer onto your desktop creates a shortcut with the familiar blue and white IE shortcut icon:

Adding a site to your favorites brings a similar result.

If your readers are viewing your site through Internet Explorer 5.0 or above then you can make your site stand out for them by simply creating a 16 x 16 pixel bitmap called favicon.ico (using the Visual Studio icon editor, for example) and placing this icon in your web site's root directory.

As soon as the user adds the site to their favorites then IE will scan that website for the favicon.ico and use it instead of the standard IE icon for desktop shortcuts, the address bar, the 'Favorites' drop down menu in IE, the shortcut bar in the taskbar (Win 98+ and Windows 2000), and in the Office Shortcut bar.

You can associate a different icon with a specific page by adding a LINK statement to the HEAD of your page:

<HEAD>
  <LINK REL="SHORTCUT ICON" HREF="http://www.mydomain.com/myicon.ico">
  <TITLE>My Title</TITLE>
</HEAD>

Click here to see the icon for Code Project.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

Chris Maunder

Sitebuilder, Editor, Staff, Admin

Chris is the Co-founder, Administrator, Architect, Chief Editor and Shameless Hack who wrote and runs The Code Project. He's been programming since 1988 while pretending to be, in various guises, an astrophysicist, mathematician, physicist, hydrologist, geomorphologist, defence intelligence researcher and then, when all that got a bit rough on the nerves, a web developer. He is a Microsoft Visual C++ MVP both globally and for Canada locally.

His programming experience includes C/C++, C#, SQL, MFC, ASP, ASP.NET, and far, far too much FORTRAN. He has worked on PocketPCs, AIX mainframes, Sun workstations, and a CRAY YMP C90 behemoth but finds notebooks take up less desk space.

He dodges, he weaves, and he never gets enough sleep. He is kind to small animals.

Chris was born and bred in Australia but splits his time between Toronto and Melbourne, depending on the weather. For relaxation he is into road cycling, snowboarding, rock climbing, and storm chasing.

Occupation:	Founder
Company:	The Code Project
Location:	Canada

Other popular HTML / CSS articles:

Five XHTML Elements You Didn't Know But Were Afraid to Ask
Exploring five useful XHTML/HTML elements that are important but not commonly used. Moreover, pointing to their relation with Internet Explorer, Firefox, and ASP.NET.
HTML For Beginners
A tutorial for those who want to learn HTML in a quick and easy way.
CSS For Beginners
Add CSS to your HTML files.
Speed Up Your Website - By Example
Learn how to optimize web page for better user experience
Color Picker Control for your Web site – A HTML Component (HTC)
Color Picker Control for your Web site – A HTML Component (HTC)

Article Top

You must Sign In to use this message board.

Msgs 1 to 19 of 19 (Total in Forum: 19) (Refresh)

FirstPrevNext

Favicon.ico not working for asp.net page?!

jgilbert

10:28 5 May '05

I keep trying to figure out how to do this for an asp.net page with code behind on other page...i put the favicon code in on the default.master page hoping it would show up on the default.aspx page...but no dice...is there something screwey going on here or am I just wasting my time with this here? lol J Gilbert
Sign In·View Thread·PermaLink	2.00/5 (7 votes)

Re: Favicon.ico not working for asp.net page?!

Maxim Langman

4:58 1 Jul '07

First of all asp.net doesn't like capital letters. Secondly, there is no such an option rel="shortcut icon". In any case, it really doesn't work
Sign In·View Thread·PermaLink

Re: Favicon.ico not working for asp.net page?!

tbetz

6:43 18 Oct '07

I have been having the same issue with ASP.NET. I use master page templates and had a rough time getting it to work, until I found a blip on MSDN about how to do it. The code was almost identical to what I had seen here, but it still didn't work until...

I changed the order of the tags in the <head> area. I made it the first tag, then it magically started to work! Big Grin

This is the code I used...

<link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon" />

I have tried a type of image/x-icon and image/ico, and they both worked for me. The key was to have it as the first tag in the <head> area.

Other browsers

yorgato

15:46 3 May '05

I might add it also works on other browsers such as Netscape for instance
Sign In·View Thread·PermaLink

Auto Refresh

Anonymous

11:59 19 Mar '05

Hi i need a javascript that checks if the user has been on the website before and if the user has been on the website before automaticly refresh the page 1 once and if they havn't been there nothing happens
Sign In·View Thread·PermaLink

.ICO

[FHD]Grey_fox

1:44 18 Sep '04

would i need some kind of program to save a .ico file? Or what should i do to get one. I have MS Paint, Photoshop7 and erm anything else that is free with windows XP home edition my site is found here: http://foxhound-delta.com
Sign In·View Thread·PermaLink

HELP ME!!!

Anonymous

19:15 8 Apr '04

what do you put in for "SHORTCUT ICON"??? and does it work for a site like angelfire or geocities?
Sign In·View Thread·PermaLink	2.00/5 (1 vote)

simple but useful

Anonymous

1:13 15 Dec '03

Only after having saw this article, I know this is a very easy thing but a boring one if you don't know how to do it!
Sign In·View Thread·PermaLink

Wrapper for Refresh Button

Anonymous

14:39 6 Jun '02

Hi There, I want refresh button not work in browser. Can any one please advise me how to do this. Any help is appreciated. Thanks.
Sign In·View Thread·PermaLink

Re: Wrapper for Refresh Button

Anonymous

5:05 9 Mar '03

Try this this will definitely work.

<HTML>
<HEAD>
<TITLE>that</TITLE>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

</HEAD>
<BODY BGCOLOR="#FFFFFF" önunload="fun();">
Click to leave page.
</BODY>
</HTML>

Re: Wrapper for Refresh Button

monicb2003

1:14 4 Jul '05

works in IE but what's happend with Mozilla, Netscape?
Sign In·View Thread·PermaLink

help!

Anonymous

18:20 14 Feb '02

I can't do it!!!!! its not working!!! I got the icon got the link checked the size of the icon -NOTHING!
Sign In·View Thread·PermaLink

Re: help!

Thomas Freudenberg

0:46 18 Feb '02

Maybe these threads in the lounge can help you:

Regards
Thomas

Finally with Sonork id: 100.10453 Thömmi

Disclaimer:
Because of heavy processing requirements, we are currently using some of your unused brain capacity for backup processing. Please ignore any hallucinations, voices or unusual dreams you may experience. Please avoid concentration-intensive tasks until further notice. Thank you.

Cool!!!

Nish [BusterBoy]

22:01 11 Jan '02

Chris I've always wondered how they do that. I thought it's an IE thing where IE automatically tries to download an icon with a standard name. Didnt think it was a simple tag Cool! Thanks too Nish p.s. I got to this article cause it came in the "Feature Article" link Sonork ID 100.9786 voidmain www.busterboy.org If you don't find me on CP, I'll be at Bob's HungOut
Sign In·View Thread·PermaLink

Bleh

Shaitu

8:40 7 Oct '01

Aar, me tried that simple code of yours and it didn't work. Probably it's just that I don't have a registered site of my own, just crapy angelfire-pages.. But if that's the prob, maybe you should create a new code ..or .. sumthin..
Sign In·View Thread·PermaLink	2.00/5 (1 vote)

Its different

Raghu Ram

23:20 25 Jun '01

This arcticle has good perspective for changing icon being online Raghu Ram
Sign In·View Thread·PermaLink

this website

Anonymous

5:02 15 May '01


Sign In·View Thread·PermaLink

Great tip!

Anonymous

13:34 21 Apr '01

thanks
Sign In·View Thread·PermaLink

32x32 for shortcuts(large icons view)

Steve Dunn

0:39 5 Dec '00

Explorer will show a 32x32 icon for shortcuts when dragged onto a listview set to 'large icons', such as the desktop, or Explorer. Just select image/new device image from withing VC++ a create a 32x32 icon. Great tip Chris!
Sign In·View Thread·PermaLink	3.00/5 (3 votes)

Last Visit: Tuesday, January 6, 2009 4:23 PM Last Update:Tuesday, January 6, 2009 4:23 PM

General News Question Answer Joke Rant Admin