Favicon not displaying

[peterjdavis]

Hi,

I'm trying to add a favicon to my Hugo / Paige site. I've created files using https://favicon.io/ and these look to align with the standard HTML that is emitted but the favicon is not displayed (I've tried different browsers to make sure not cached).

From what I can see the HTML is hardcoded in the links.html partial which is part of the theme, is there anyway to customise this HTML in my site (without changing the theme)? Or has anyone else managed to get this to work?

Thanks

[willfaught]

The favicon files are in Paige's static/ directory. They should be able to be overridden by placing your own favicon files with the same paths and names in your site's static/ directory. What are the file paths and names you're using?

[peterjdavis]

Thanks for getting back to me so quickly.

I think I've found the issue, I don't have an svg version of my favicon, because favicon.svg exists in Paige's static/ directory it's being deployed and rendered on my page, but I'd like to show the png or ico version of my favicon rather than the theme default.

Is there a way to modify the links.hml output to remove the
<link href="/favicon.svg" rel="icon" type="image/svg+xml">
element without modifying the theme or copying the whole partial and modifying in the site?

Thanks

[willfaught]

I'd like to better understand your situation and constraints. When I put default favicons in the theme, I assumed it's easy to generate all the alternative formats from whatever master format one might have. Is it not possible for you to generate an SVG from your PNG, or vice versa?

[peterjdavis]

I've managed to generate an SVG now https://express.adobe.com/tools/convert-to-svg (I didn't realise it was quite so simple to generate a vector image from a bitmap), so I've resolved the issue now.

Thanks for your help 👍

[axjms1]

So my understanding is that I would be able to place my favicon.svg in the static directory of my site, rebuild the site and the updated favicon would show up?

[willfaught]

Yes. Restart the Hugo server too for good measure. As shown above, you'll need to generate png and ico versions of your svg too. (Favicons are a mess in general.)

[willfaught]

Look at the files in Paige's static directory, and make all of them. I used https://realfavicongenerator.net to make Paige's default favicon files.