My Favicon shows in Google Chrome but not in IE

  • 1
  • Question
  • Updated 3 years ago
  • Answered
Hi!

Why does my Favicon show in Google Chrome but not in IE? Is there any where I can change that so it will show up on all internet browsers?

My website: http://unofficialesc.com/

Thanks, Darren
Photo of Darren Frazer

Darren Frazer

  • 2 Posts
  • 0 Reply Likes

Posted 6 years ago

  • 1
Photo of Crystal

Crystal, Champion

  • 250 Posts
  • 79 Reply Likes
Hi Darren,

It seems that the issue with the Favorite Icon is a common problem with IE. Here is a link with many solutions that may help: http://social.msdn.microsoft.com/Foru...
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hello Darren,

Here is a code that produces the visible icon and is cross-browser effective:
<link rel="shortcut icon" type="image/x-icon" href="resources/favicon.ico" />
you can add this to your header tracking codes
favicon.ico is the favicon image name, which can be any valid image name, and .ico type.

If you don't already have an ico file converter this one is easy to use: ICO converter
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Darren

Please let me know if Gop's solution helped you. What I noticed is that the favicon image in your Favicon dialogue box with Yola is different from the favicon I see on your published page in Firefox and Chrome. In your Favicon dialogue box within your Yola account it displays a blue "DF" icon while there is a star icon in the browser tab of your live site.

If you aren't able to make it work, please leave everything around your favicon in your Yola account as it is now, so our specialists can investigate.
Photo of Darren Frazer

Darren Frazer

  • 2 Posts
  • 0 Reply Likes
Hi!

Thanks for the help! But I tried what Gop said to do and it is not showing up in IE.

What next?
Photo of Crystal

Crystal, Champion

  • 250 Posts
  • 79 Reply Likes
Hello Darren,

A couple of ideas that may work.. try adding a ? after the file path:

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


Or if the ico file was created by renaming a gif or jpg, use the following site to auto convert the original image file into an ico file: http://www.prodraw.net/favicon/index.php Before uploading the new ico file, delete the previous file and clear the IE cache.

Hope it works. Please let us know if it doesn't.
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Darren

I think what might be the reason it doesn't work is that Internet Explorer struggles to interprete favicons which don't have the .ico format. If I see it correctly, the file type of your favicon is .png instead of .ico. Can you please follow Gop's advice above, convert your favicon, re-upload it and retry? Let me know how that goes.
Photo of Wuz

Wuz

  • 3 Posts
  • 1 Reply Like
I was having the same issue with favicon showing in all browsers except IE. I changed my file extention from .png to .ico but never converted the image itself. As suggested by Gop above I loaded the image to
http://www.icoconverter.com/ then uploaded to my server root. Now all pages from my site automatically display favicon even though I have not included any code to tell them to do so. IE Included.

Thanks Gop, this helped a bunch, I could not figure out what the deal was. I even changed the file extension to .testthisext and it worked fine in chrome when adding < link rel="shortcut icon" href="my_image.testthisext" > to the head section of pages.

How does this make you feel? - Happier than a fly in a port-a-potty THANKS!!
Photo of Teri Szucs

Teri Szucs

  • 3 Posts
  • 0 Reply Likes
I did the same as Wuz, but it's still not showing in IE
Photo of Martti Kuku

Martti Kuku

  • 1 Post
  • 0 Reply Likes
Your icon will show up if you close the link tag
Photo of Wuz

Wuz

  • 3 Posts
  • 1 Reply Like
Hi Teri,

If you converted the jpeg/gif/png image to .ico with the converter next step is to load the ico file into the very first directory of your webhost. This may be the root folder or public html depending what you are working with.

I found that use of favicon.ico as file name seems to be more reliable than giving it an alternate name.

During my crash course I noted that if I included the line
< link rel="shortcut icon" href="favicon.ico" >
in head section of a page that was located in a sub directory the icon would not appear unless I added the ico file to that folder. However, if the link was not included in my head section the icon would be displayed.

You already took care of the hard part, discovering the ico converter.

Suggestions;
- Remove the icon file that was not converted if any
- Reload your converted icon file to server root or public html (keep name favicon.ico)
- Create new page in same directory as .ico file without adding the link to head section. (At this point your icon should appear on all browsers if you load the page)
- Now add the link to head section of your new page and refresh(Result will be same as above)
- At this point if all has not worked as described then your icon is an issue, may need to be smaller size.

Now lets fix the original problem. The page you were working with that caused you to post here.
- Remove the favicon link from head section
- Open page in IE (icon should be visible, if not remove your page from browser history then try refreshing it.)
- If you now see your icon in IE all is working just as it should / If no icon visible then favicon.ico was not put in highest level folder (root/public html) and needs to be moved accordingly for it to work.
- Assuming all is still going as it should at this point you are ready to put the favicon link back into head section of your document.
- Refresh the page again (If no icon in IE now your document is in a sub directory. Simple fix would be to add favicon.ico into that folder and it will work again.)

Consider this, maybe you wish to have a different icon on pages that are visible to the public vs pages in a members section. Each folder (Directory) can have a favicon file and the documents in that folder will display that icon. If you use the link in head section of a page the icon file needs to be available or you get nothing.

I have yet to come across a forum or tutorial that does a good job covering this subject so I tried to cover all the bases here. I learned by trial and error so there very well could be an easier method and hopefully someone will share it. I Hope this helps you Teri.
Photo of Deepak Ganer

Deepak Ganer

  • 1 Post
  • 0 Reply Likes
even i have same problem but in my case its showing in main page of my website but not showing in sub sites

please help me for the smae'
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Deepak

There is a number of suggestions on this thread to solve the problem for Internet Explorer. Have you tried them all? Apart from that, I'm afraid that there's not much we can do for you from our side because this issue is related to Internet Explorer.
Photo of Wuz

Wuz

  • 3 Posts
  • 1 Reply Like
Put .ico file in first folder for each subdomain. example.com and subsite.example.com are not the same place so icon shouldn't work as you are attempting to make it.
Photo of dellmerca

dellmerca

  • 1 Post
  • 0 Reply Likes
More about....favicon

Dell