Manual Image Selection

[bemayr]

Description

The preview images for references should be overrideable manually (in the case of no or a wrong image). Those should be selectable based upon 5 up to 10 predefined images.

Idea

To integrate everything into code (no runtime configuration necessary) put the images alongside the website as shown in: Then upon the static website build an index file with the images should be created, which is utilized in the CMS via the image selector.

Roadmap

• [x] add the images
• [x] prepare 11ty to include those images and add them as a collection
  • https://www.raymondcamden.com/2021/04/07/building-a-simple-image-gallery-with-eleventy
  • https://www.aleksandrhovhannisyan.com/blog/eleventy-image-plugin/
  • https://github.com/11ty/eleventy-base-blog/blob/master/.eleventy.js
  • https://www.11ty.dev/docs/data-global-custom/
• [x] only provide the image names and supply the pathes via configuration variables
• [x] create a custom view in Keystone.js that utilizes the text-field but displays an image picker via radio buttons
• [x] integrate those images into the OpenGraph data selector

[bemayr]

This was introduced in https://github.com/bemayr/young-carers-austria/commit/c50c6b5f73cc0d91c9553d8b7dce730a64ce549e and will be improved once the CMS is switched to Payload CMS.