Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
0

favicon does not show in google chrome tabs or bookmarks?

New Here ,
Mar 19, 2013 Mar 19, 2013

i cannot get favicon to display in google chrome tabs/bookmarks.

I might have the code screwy...?

Screen Shot 2013-03-19 at 11.23.06 AM.png

TOPICS
How to
29.0K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 19, 2013 Mar 19, 2013

Hello jan,

our browsers must be "convinced" first to show It! Upload the favicon.ico file to your server's root directory. Insert this line of code between the <head> </head> tags on your home or index.html page (I prefer that):

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

Clear ALL your caches!

Check with another browser, the new icon will be there.

Or:


- If set, delete the bookmark to the page or re-create the bookmark.
- Quit browser
- Empty the Temp Internet Files Internet Options
- Clear History
- Delete everything in general, where the browser remembers visited sites.
- Restart
- Clear Site visit
- Clear Bookmark


Good luck!

Hans-Günter

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Mar 20, 2013 Mar 20, 2013

i have cleared google chrome cache.

favicon file is in site root folder under images.

i place code between <head><head/> tags under "title" any suggestions?

this worked in safari preview, for url and bookmarks.

<link rel="icon" type="image/png" href="images/favicon.png"  />

tryed both of these and no result in chrome.

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

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

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 20, 2013 Mar 20, 2013

Two things:

If you used what you pasted above on your homepage...

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

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

...as written and with the favicon.ico in your images folder, it won't work. The links would have needed to be changed to reflect the fact that your .ico file was inside the images folder...

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

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

Secondly, placing the .ico file in a folder called "images" within your root folder means it is not "in your root folder" as I described above. Placing it on the same level as your index.html would be "in your root folder" for automatic detection by browsers with no links needed.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Mar 20, 2013 Mar 20, 2013

Do as Jon has stated multiple times above and place your favicon.ico in your root folder with your index page. There is no need to add anything to your pages, as it will be automatic. It works across all browsers.

Jim

PS. Thanks Jon, I learned something today... or yesterday.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Mar 20, 2013 Mar 20, 2013

thank you.

problem solved.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 19, 2013 Mar 19, 2013

Hmm, I don't know about your code. I've always used...

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

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

Also, make sure you've uploaded the .ico file to your server.

If you put the favicon.ico file in your site's root directory, there shouldn't be any need for the link at all. Browsers should automatically pick it up.

I know for myself the OCD can kick in pretty hard having an image file floating out with my index.html, but it's a perfectly legitimate way to do it.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 06, 2015 Mar 06, 2015
LATEST

Export your HTML and then just edit index.html with any text editor look for sentence <link rel="...................................>

Then delete all this sentence and copy this one


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

PATH = Where you have your favicon.ico

I usually copy the favicon.ico in the folder images so the sentence will be like this

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

i hope it helps you

Sorry about my english, my spanish is much better

Juan Pedro Avila

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines