Dynamic arrays or loop?

support
1

I’m just starting with hugo and want to have a product with multiple images. Right now Ive got a modal view that shows the main image and 3 other images below that

Untitled-2.png752×626 609 KB

Theres an example of what I have. Now the smaller images are quickly hacked into the modal view

<div class="thumbnail"> <img src="{{ $main | absURL }}" alt=""> <img src="{{ $slide1 | absURL }}" alt=""> <img src="{{ $slide2 | absURL }}" alt=""> <img src="{{ $slide3 | absURL }}" alt=""> </div>
Is there a way I can have the product markdown and just say something like
photos: one.jpg two.jpg three.jpg

And do a loop in the modal partial to read that and do this dynamically? Because right now even if a product does not have these extra images the css hover still exists, it also means I can only have a set number of images. Id like something a bit more flexible.

Im sorry if this doesnt make sense or if you need more info. Im hacking apart the agency theme and using that modal view for now

2

I use the “FancyBox”.
http://fancybox.net/

3

If I understand you, It’s actually pretty easy to do.

---
title: Some Title
images:
  - image_path: /images/image.jpg
    caption: some caption
  - image_path: /images/image2.jpg
    caption: some caption
---

then, on a single entry page, loop through images

{{ range .Params.images }}

{{ .image_path }}{{ .caption }}

{{ end }}

That’s a start.