Resize images in partial html file

1

Dear Hugo Developers,

I’d like to make a one-page-site with a short gallery. This is my partials/gallery.html (this is working) code:
{{ range (where .Pages “Section” “gallery”) }}
{{ range last 3 .Pages.ByDate }}

{{ end }}
{{ end }}

But if I’d like to use the .Resize Hugo’ll show error messages.
Can u help me?

Thanks
Lara

2

.Resize is only available for Page Resources or Assets.

The doc should get your started on your reflection. Let me know.

3

Thanks for your answer.
But how can I use .Page.Resource in the partial? I haven’t found in the doc.

4

Well hard to guess without the definite code. But I can see you are ranging on a collection of pages.

So if those pages have Resources (files along side the page’s index.md then, within that range you can access the page’s resources if you have several images per gallery, you’d have:

{{ range (where .Pages “Section” “gallery”) }}
   {{ range .Resources.ByType "image" }}
     {{ $resized_image := .Resize "400x" }}
     <img src="{{ $resized_image.RelPermalink }}" />
   {{ end }}
{{ end }}

The methods I’m using are all documented in the doc. You can also check the following post on the matter.

3 Likes