Website Icon Not Showing Up in Google Chrome

StackOverflow https://stackoverflow.com/questions/21296044

  •  01-10-2022
  •  | 
  •  

Question

I've visited these questions and none of the answers worked for me:

Why doesn't my fav icon work in Chrome any more?
Chrome doesn't show the favicon

My Code

My website is http://mikeyaworski.com and this is the code I use to set my icon:

<head>
    <title>mikeyaworski</title>
    <link 
          rel="shortcut icon" 
          href="http://mikeyaworski.com/myicon.ico" 
          type="image/vnd.microsoft.icon" 
    >   
</head>

This is my entire code.

What I've Tried

  • Instead of rel="shortcut icon"I've tried rel="icon"

  • Instead of type="image/vnd.microsoft.icon" I've tried type="image/x-icon"

  • Instead of href="http://mikeyaworski.com/myicon.ico" I've tried href="myicon.ico"

The icon works in Mozilla and Internet Explorer. The icon does not work in Google Chrome. Any ideas?

Was it helpful?

Solution

Your html is invalid and your browser tries to fix it. In doing so your link tag ends up outside the head and is ignored, fix your html and it will work

<!DOCTYPE>
<html>
  <head>
    <title>mikeyaworski</title>
    <link rel="icon" href="myicon.ico" type="image/vnd.microsoft.icon">

  </head>
  <body>    <!-- body tag should be here -->
    <h1 style="text-align:center;font-family:trebuchet ms;" id="top"><br><br>Hompage</h1>
    <p>
    Coming soon. Until then, view my <a href="http://stackoverflow.com">StackOverflow</a> and other StackExchange profiles:
    </p>

    <a href="http://stackexchange.com/users/2644958">
      <img src="http://stackexchange.com/users/flair/2644958.png?theme=dark" width="208" height="58" alt="profile for mike yaworski on Stack Exchange, a network of free, community-driven Q&A sites" title="profile for mike yaworski on Stack Exchange, a network of free, community-driven Q&A sites">
    </a>


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

OTHER TIPS

Try using the following code:

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

Or Else have a go at the link below with similar discussion:

local (file://) website favicon works in Firefox, not in Chrome or Safari- why?

Update: Or else give a following link a try: Fix missing favicons on Google Chrome

Hope this helps. Thanks, Jatin

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top