I’m trying to create an image gallery in the laziest way, that is processing all the files in a static folder for each gallery. I’m using hugo version 15 and readDir.
This gallery should be generated within a single.html
template of the content type recipe
, so I decided to use a partial template. My problem is the following:
- every recipe has its set of images in
static/images/$recipe
- how can I represent $recipe in my partial?
This is my (almost working) partial with an absolute link to a single folder:
{{ $url := "/images/pesto" }}
{{ $files := readDir "/static/images/pesto" }}
<div>
{{ range $files }}
<figure>
<a href="{{$url}}/{{.Name | urlize }}">
<img src="{{$url}}/{{.Name | urlize }}">
</a>
</figure>
{{ end }}
</div>
Obviously, pesto
should be replaced by $recipe.
$recipe could be basically either the file name of the markdown file or the title parameter. I guess I may use .Title
within the range of pages of type recipe, but then how can I join the string to the base path (/images)?
After reading this topic I realized that I may use printf
. So I’ve reworked the example this way:
{{ range where .Site.Pages "Section" "recipe" }}
{{ $url := .Title | printf "/images/%s" }}
{{ $folder := .Title | printf "/static/images/%s" }}
{{ $files := readDir $folder }}
<div>
{{ range $files }}
<figure>
<a href="{{$url}}/{{.Name | urlize }}">
<img src="{{$url}}/{{.Name | urlize }}">
</a>
</figure>
{{ end }}
</div>
{{ end }}
But I’m getting this error:
reflect: call of reflect.Value.Type on zero Value in partials/gallery.html