Why is my WebMatrix project still using the old favicon.ico file?

Question

The default favicon.ico that gets included in a WebMatrix product is added in _SiteLayout.cshtml like so:

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

That icon does not fit my app, so I converted a jpg I created at http://www.coolutils.com/Online/Image-Converter/.

I renamed favicon.ico to YourMotherWearsCombatBoots.ico and renamed the image I had converted to favicon.ico (after adding it to my project).

I thought that my new .ico file would get used in the browser's tab for the page/site. But, alas, no! The old .ico file is making like the Raven of Poe's poem - it simply will nevermore go away. What's up with that?

UPDATE

Note: If trying this out using firefox or IE as the browser doesn't work (currently testing with Chrome), I am going to bountify this question for 50 points ASAP. If I get an answer prior to that, I will award the bounty post-answer.

Answer 1

Clear the cache :)

As long as the path to the file (including the filename) is correct, and it is a .ico file, it should render.

That having been said, try not using ~ maybe, since it is only an html tag and it uses / to find the root of the site.

I've done this many many times, and never had any issue with any ico in any browser.

Honestly the cache is the only thing I can think of.

----------------------------------UPDATE----------------------------------

I'm expanding my answer to show an example. This is a scenario I have just recently set up and it worked perfect first time (as it does for me every time).

The HTML:

<link href="/Images/Site_Icon/Scribe.ico" rel="shortcut icon" type="image/x-icon" />

The Directory Structure:

The Result:

Since I've been using icons for my sites, I have not noticed that there need be anything else. As far as I know this is all that should be involved with getting this to work as expected.

If this still does not help, do the following:

1. Re-verify the path, check it one folder at a time.
2. Delete the old Microsoft favicon entirely, unless you plan on using it for something else (which I doubt).
3. Open the ico file you are trying to render. Is it really the picture you expect it to be?
4. Manually (Ctrl+Shift+Del) clear the cache (especially for Chrome) and try again (if you're gonna debug in Chrome, you might as well get used to doing this regularly [okay, actually it doesn't matter what browser you use, you'll always have to do this when something doesn't render the way you expect, so that you'll know it's not a caching issue]).
5. Make sure you're looking at the right site, when it's open in your browser (i.e., make sure that you're not editing your site locally and pulling a non-updated version from your server or something).

Other than that, I can't think of anything else it could be.

Answer 2

Most likely an issue with the browser rather than anything to do with WebMatrix or code.