og images expanded

This commit is contained in:
madrilene 2024-02-01 10:14:12 +01:00
parent 6b374b8583
commit 57df591073

View file

@ -30,3 +30,17 @@ The fallback and default image for all other pages is the image set as `opengrap
{% endraw %}
To change the look and behaviour of those images and replace the SVG background edit `src/common/og-images.njk`. The implementation is based on [Bernard Nijenhuis article](https://bnijenhuis.nl/notes/automatically-generate-open-graph-images-in-eleventy/).
## Recommendation
If you want to get a little more creative, have a look at[ what Lea does here](https://github.com/learosema/lea-codes/blob/main/src/opengraph-default.njk).
## v2.0 update
Previously the images were created at build time, but this leads to problems with the set font - if the system executing the build has not installed it, it will not be generated.
The solution is to always build the page yourself and then place it on the server directly. Or, as [Sophie Koonin does](https://github.com/sophiekoonin/localghost/blob/main/eleventy.config.js#L45-L47), explicitly specify the system to be used for the build and select a font that this system has installed by default.
At the moment I have relocated the creation of the images in the development process, so that the font only needs to be installed on your own system. The images are located in `src/assets/og-images` and are comitted.
This is fine as long as you only work with markdown and the font is always installed on your system, how this works with a CMS workflow remains to be seen. Please let me know if you encounter any problems.