Range over resources in partial

I’m calling a partial like this:

{{ partial "gallery" . }}

and then that partial runs this bit:

<!-- Gallery -->
{{ with .Resources.GetMatch "gallery" }}
	<div class="gallery {{ .Params.gallerystyle }}">
		{{ range . }}
		<article>
			{{ $thumbnail := .Resize "360x250" }}
			<a href="{{ .RelPermalink }}" class="image">
				<img src="{{ $thumbnail.RelPermalink }}" alt="" />
			</a>
		</article>
		{{ end }}
	</div>
	{{ end }}

And yet, the site builds with an error message saying: range can't iterate over {{<nil> 0 0} {{0 0} 0} false {{0 0} 0} {0 0} 0xc420991680 0 073352fc9a6d4dd131571f06ac0f5a2b 0xc420af25a0}

The content’s params have this metadata:

resources: 
  - src: "gallery/*.jpg"
    name: "gallery"
    title: image-:counter
    params:
      gallerystyle: "style2 medium lightbox onscroll-fade-in"

I’m at a loss here, can someone point me in the right direction?

GetMatch only returns one resource, so you are using range on this one resource, which is not possible, range is for collections.

1 Like

Thanks, I didn’t know that. So if I use Match .Resources.Match “gallery” it should work?

No because then you will be using .Params.gallerystyle on a collection of resources :slight_smile:

You’ll have to adapt your html accordingly, but yeah, it will work.

Though if there are serveral resources matching your query, you’ll have several div.gallery.

1 Like

Thanks @regis it’s working now. :slight_smile:

{{ $gallerystyle := .Params.gallerystyle }}
{{ with .Page.Resources.Match "gallery" }}
		<div class="gallery {{ $gallerystyle }} ">
			{{ range . }}
			<article>
				<a href="{{ .RelPermalink }}" class="image">
					{{ $thumbnail := .Resize "360x250" }}
					<img src="{{ $thumbnail.RelPermalink }}" alt="" />
				</a>
				<div class="caption">
					<h3>{{ .Params.title }}</h3>
					<p>{{ .Params.description }}.</p>
					<ul class="actions">
						<li><span class="button small">Details</span></li>
					</ul>
				</div>
			</article>
			{{ end }}
		</div>
{{ end }}

Awesome! You could grab your gallery style from within your range using $.Params.gallerystyle and avoid storing it in a variable but I’m just bragging now :wink:

And if $.Param "gallerystyle" is used, you can set Params -> gallerystyle in your site config, which will be used as default if a page front-matter does not define that param :slight_smile:

Or does $.Params.gallerystyle do the same thing? Or limit to checking just the page and not the site params? I haven’t tested…

1 Like

I’m porting a template that uses a series of classes to set different color schemes and options for it’s components. That’s why I am using the $gallerystyles and other similar frontmatter.

Didn’t know I could set those defaults in config.toml. Will certainly keep that in mind when I am testing this ‘live’ and have to edit content.