Curious as to whether anyone in the community has come up with an easier partial, etc using Hugo’s image resizing (e.g. apple-touch-icon.png, favicon-32x32.png, etc) and output formats (e.g. site.webmanifest) so that it’s just a matter of dropping in a square image into assets or static and adding a couple params into config.*. Feel like this would come in really handy for creating a sorta boilerplate Hugo starter. Thanks ahead of time for anyone willing to share some code.
Note: I currently use https://realfavicongenerator.net/ to generate favicons, which is already pretty convenient, so please no recommendations for external services. I’m looking for something pure Hugo
I also think it would be an important addition to Hugo. With the way Hugo handles asset bundling/minification, it would be great to have favicon support as well and control it from the config file or within the theme partials.
Besides the ease-of-use, it’s especially important due to the fact that favicon management is cumbersome when you count in all the platforms and devices. Real Favicon Generator approaches this quite nice.
In my spare time, I’ll work on contributing to Hugo in that regard with the help of Real Favicon Generator’s non-interactive API.
Resizing a 500px image into a 16x favicon rarely works right. You often have to adjust pixels in order for the human eye to see the right shape.
But you could define (hard coded or param) a slice of sizes and range through those. Upon finding an existing asset with the proper naming convention (size included), use its .Permalink.
Upon “not” finding it, resize the “original” asset to the size at hand and use that .Permalink. Keep ranging.
This way you could easily have one of the needed size ready, and the missing one generated by Hugo.
This can either by via Hugo Pipes or Page Resources (on the home bundle for instance)
But you could create a preview of those files somewhere. Simple custom layout page or Custom Ouput format on the home page.
This markup file (public) would show you all those generated sizes
If one does not suit, just drop a file with the correct filename (where you decided to store you files), and Hugo will know to use that file instead of Resizing.
I was looking for a way to have my favicon.ico processed as asset. Found nothing.
But I can give my setup for this thread.
I also use https://realfavicongenerator.net.
I found a way for Hugo to “generate” an ico but it’s really hacky. You need to place the png favicon in the asset directory, fetch it, resize it to 32x32 and create a resource from the resized image as favicon.ico.
As for what I do, I have a folder of favicons which are mounted to the assets directory. I also specify the favicons in the site’s config with their attributes and render them out.
