Post feature/cover image from resource metadata?

Using Themes
1

For quite a while now, I am using Hugo to display my photographic work. I built a theme which treats posts as galleries, and a gallery (post) can contain images. This nearly perfectly suits my needs for https://kaiser.gallery

Metadata (date and title) is being read from the EXIF tags, which is fine for my needs. However some people might like to manually add those information to the images without changing the files (or overriding existing EXIF tags).

Recently I learned about Page resources metadata, so I added the possibility to read metadata (in this case the image title) from there:

---
date: 2024-02-18T14:12:44+0100
title: Cats
featured_image: cat-8.jpg
resources:
  - src: cat-1.jpg
    title: Brown tabby cat on white stairs
  - src: cat-2.jpg
    title: Selective focus photography of orange and white cat on brown table
---

Currently, as can be seen in the above front matter, the “featured image” (the album cover, used for lists, etc.) is set as featured_image.

Would it (from a “make it the Hugo way” perspective) make sense to also move this information to the resources node?

  ---
  date: 2024-02-18T14:12:44+0100
  title: Cats
- featured_image: cat-2.jpg
  resources:
    - src: cat-1.jpg
      title: Brown tabby cat on white stairs
    - src: cat-2.jpg
      title: Selective focus photography of orange and white cat on brown table
+     params:
+       cover: true
---

The theme would then take the first image with “Params.cover=true” as album cover.

Does this make more sense than directly referencing the cover image as featured_image?

I saw multiple approaches to this in different themes, many just take the first image or the first with *feature* in its name. However for my theme I’d like to be able to directly reference a cover image instead of relying on the file name.

What do you think?

2 Likes
2

You have great looking website.

I agree with your approach for two reasons:

  • This will enable usage of any image from available gallery as featured. You can play with featured image regularly with a simple toggle of cover
  • Makes data representation more logical

Best wishes !

3

I prefer the filename approach, because of:

  1. Less configuration, cat-2-feature.jpg shoud match, just like an extra extension.
  2. Compatible with other internal templates, i.e. twitter-cards, opengraph and schema, if you’re using those templates, you won’t need to do extra configuration.
1 Like
4

A third option is to use the first array element as the cover image.

1 Like
5

The thing is, for a photo gallery post, I might not want to a) rename one file out of the images to or b) use the first image as cover image. So I need some way to specify which of the resources will be used.