Since a few weeks, the favicon of my webzine is no longer displayed, and this on the browser of my work, but also on my personal PC.
I do not think I have changed the configuration. I tried to re-upload it, to no avail.
https://www.yubigeek.com/
In the Google Chrome Developer Console, there is an error on favicon.ico (404) but in the source code of the page, this URL is not called.
There are however two tag link with a rel = "icon" and the URL of the favicon, if I click on the links, the images are there.
This is due to a div
markup which wrongly appears if the head
section of your pages. Such markup should only be in the body
.
More details
Most browsers accept body
-only markups in head
. But Chrome has a particular behavior. When this happens, Chrome considers the head
section to be closed. Therefore, following head
markups are actually considered to be in the body
. And since favicon markups do not work when there are in body
...
This is why your favicon fails on Chrome but works on Firefox.
How to fix
Your first two div
are around line 153, still in the head
. As a hint, their ids are fb-root
and fb-customerchat
. That should help you spot which plugin is doing this.
Should you disable this plugin, at least for now? Your choice.
You should also report this issue to the plugin developer. You must not be the only one impacted by this issue.
The best way to add WordPress Favicon is adding favicon via Appearance > Customize > Site Identity
. Create favicon image at least by 512 x 512
and follow the path to navigate. Then upload the image in Site Identity
section. Save
it and you're done.
Please follow this for more info.
It seems you're using a PNG image, you can try to add attribute type
.
So your link would be something like : <link rel="icon" href="yourpath" type="image/png">
EDIT : Plus, put your .ico
file in the root of you website if it's not already done.