Search code examples
htmlgoogle-chromefavicon

favicon not working for one (token) page in chrome


I have a problem with my favicon in Chrome. It won't show in one page. I don't really know why but I guess it's because it works with a token, so if the token is different it takes other stuff from my database. in other words the page is never the same. I also tried some other stuff from stackoverflow but it wouldn't work either. Somehow it will work in Microsoft Edge.

this is what I tried so far (header.php):

<link rel="icon" type="image/png" href="/healtywavezicon.png">
<link rel="shortcut icon" type="image/png" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="57x57" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="60x60" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="72x72" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="76x76" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="114x114" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="120x120" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="144x144" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="152x152" href="/healtywavezicon.png">
<link rel="apple-touch-icon" sizes="180x180" href="/healtywavezicon.png">
<link rel="icon" type="image/png" sizes="192x192" href="/healtywavezicon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/healtywavezicon.png">
<link rel="icon" type="image/png" sizes="96x96" href="/healtywavezicon.png">
<link rel="icon" type="image/png" sizes="16x16" href="/healtywavezicon.png">

I also tried to put it directly in the index.php:

<head>
  <link rel="icon" type="image/png" href="/healtywavezicon.png">
  <link rel="shortcut icon" type="image/png" href="/healtywavezicon.png">
</head>

Solution

  • If your favicon does not work on Chrome but works on Edge, Firefox and others, this may be because your header contains a body-only markup.