Content adapter: Set featured image per category

support
1

Cheers there @jmooring. I found this neat topic and I was playing around with the example site. For the category lists page, how would you pull a featured image from a post in each category to act as the featured image for that category (/categories/ list)?

2

The example you reference loosely couples images with pages via the “sku” page parameter.

Given your additional requirement, I would refactor the example to create one or more page resources for each product using the AddResource method within a content adapter.

This makes it much easier to get a related image when rendering a term page.

3

I have studied the addResource documents and I can’t for the life of me understand how to fetch the image. Adding {{ with resources.GetMatch (printf "images/%s/%s/featured.*" .Section .Params.sku) }} as the image source with error checking prints the errow below. Any pointers?

Source changed /products/_content.gotmpl
ERROR Unable to get resource images/%!s(<nil>)/%!s(<nil>)/featured.*
ERROR Rebuild failed: logged 1 error(s)

{{- $url := (printf "images/%s/%s/featured.*" .Section .Params.sku) }}
  {{ with resources.GetMatch $url }}
    {{ $content := dict
      "mediaType" .MediaType.Type
      "value" .
    }}
    {{ $resource := dict
      "content" $content
      "path" (printf "%s/featured.%s" $item.title .MediaType.SubType)
    }}
    {{ $.AddResource $resource }}
   {{ else }}
    {{ errorf "Unable to get resource %s" $url }}
  {{ end }}
4

This is a modified version of the example site from the topic you referenced. It requires Hugo v0.146.0 or later.

git clone --single-branch -b hugo-forum-topic-54852 https://github.com/jmooring/hugo-testing hugo-forum-topic-54852
cd hugo-forum-topic-54852
hugo server

The content adapter creates a page for each product, and zero or more page resources for each product (i.e., images in this case).

The term page loops through all pages with the given term until it finds one with an image. That image is then displayed on the term page.

Files of interest:

  • content/products/_content.gotmpl
  • layouts/products/page.html
  • layouts/term.html
2 Likes
6

I want to say Huge Thanks for this implementation.

2 Likes