From 57df59107362c1d930c71e853dff8a9f417daf5c Mon Sep 17 00:00:00 2001 From: madrilene Date: Thu, 1 Feb 2024 10:14:12 +0100 Subject: [PATCH] og images expanded --- src/posts/2023-01-25-opengraph-images.md | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/posts/2023-01-25-opengraph-images.md b/src/posts/2023-01-25-opengraph-images.md index 9d96972..41d89a3 100644 --- a/src/posts/2023-01-25-opengraph-images.md +++ b/src/posts/2023-01-25-opengraph-images.md @@ -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.