CODEWITHSUNDEEP
htmlinternet-explorergoogle-chromeiconsfavicon
Arrow
Arrow

Reputation: 2904

Yet Another "Why isn't my Favicon showing?"

Update

I have just tried "Pinning" my site to the Taskbar again (after removing it) but when I clicked and held down the mouse button on the 16x16px icon inside the address bar (see pic below), you can see my favicon being dragged around with the mouse - so internet explorer has found and got the icon - it's just not displaying it in all the right places! Also updated code below: enter image description here

As the title suggests, I can't get my favicon to display; in any version of any browser. There is 1 exception, though - which isn't good enough:

IE 9 and IE 10 - enter image description here

As you can probably see in the screenshot above, the only time I get to see my favicon is after I've added it to my Favorites folder and opened the Favorites Bar. The favicon does not display in the Tab (next to the page title), it does not display in the Taskbar area, and it does not display up the top-left of the browser window if I have "Pinned" my site to the Taskbar.

In every other browser, it simply does not display at all.

I have tried every possible "solution" that I could find online.

Here's the code I have:

    <link rel="icon" type="image/x-icon" href="http://www.mysite.com/favicon.ico"><!-- Major Browsers -->
    <!--[if IE]><link rel="shortcut icon" href="http://www.mysite.com/favicon.ico"/><![endif]--><!-- Internet Explorer-->

I have also tried all common sizes for the favicon; 16x16, 32x32, 64x64, 128x128 and 256x256 - and I've even tried saving all sizes within the same *.ico file.

I have tried deleting the cache file for *.ico files.

Nothing has worked. The exact same code has previously worked on other sites that I've made. I don't get it. What gives?

Upvotes: 0

Views: 8335

Answers (3)

theknightD2
theknightD2

Reputation: 331

I use

<link rel="icon"
      type="image/ico"
      href="Link Goes Here">

If putting the favicon in a folder:

<link rel="icon"
      type="image/ico"
      herf="Folder/Subfolder"

Make sure the code is in the head tag. Make sure the image is in the .ico format; It won't work otherwise.

Upvotes: 0

Frog Pr1nce
Frog Pr1nce

Reputation: 728

I had the same problem with my site just now. Drove myself crazy trying to get an favicon.ico file to work. What finally got it working correctly for me in IE 11 (on Windows 7), was to dump the favicon.ico file completely and go with a PNG instead:

<link rel="shortcut icon" href="/favicon-32x32.png" type="image/png"/>

I used a PNG file with a transparency layer. Once I did this and uploaded my page, IE began displaying the icon correctly in the Tabs (and the shortcuts/bookmarks) on the very next page refresh. I double checked and it looks like Chrome and Firefox are cool with this as well.

Upvotes: 0

djmati11
djmati11

Reputation: 597

I've edited this answer, leaving only solution to problem presented in question.

Use: <link rel="shortcut icon" href="{ICONURL}"/>

Instead of: <link rel="icon" href="{ICONURL}"/>

Upvotes: 4

Related Questions