Multilingual range of content

support
1

Hi,

I want a list.html for the fotos folder and then a single template for the countries. If I understand it right.

I get the following error:

render: [de v1.0.0 guest] failed to render pages: render of "D:/Code/example_2027/content/de/fotos/_index.md" failed: "D:\Code\example_2027\layouts\fotos\list.html:9:17": execute of template failed at <.thumb>: can’t evaluate field thumb in type page.Page

My list.html:

{{ define "header" }}
<h1 class="main-headline">{{ .Title }}</h1>
{{ end }}

{{ define "main" }}
{{ range .Pages }}
<a href="{{ .Permalink }}">
    <img src="{{ .thumb }}" width="360" height="260" alt="{{ .caption }}" class="galleryimage cursor" data-image="{{ .image }}">
</a>
{{ end }}
{{ end }}

My _index.md:

+++

draft = false

title = 'Fotos'

description = 'Fotos aufgenommen von M.'



[params.gallery.deutschland]

headline = "Germany"

gallery_section = "deutschland_section"

[[params.gallery.deutschland.images]]

    caption = "Germany - Foto #1"

    thumb = "/images/photos/deutschland/deutschland-01-thumb.webp"

    image = "/images/photos/deutschland/deutschland-01.webp"

    id = "deutschland_Photo_1"

    url = '/fotos/germany'

+++

{{< gallery "deutschland" >}}

My folder structure:

Screenshot 2026-09-28 184316
Screenshot 2026-09-28 184316516×1210 45.3 KB

I want something like: https://example.com/de/fotos/germany

Hard to explain.. I am not a native speaker sorry :slight_smile:

2

Hard to get something to recommend, if you cannot describe what you want.
maybe visualize how the result should look like on these pages.

So before I recommend anything I do not understand how your _index.md and the COUNTRY.md’s relate together.

maybe these questions could help you to formulate or visualize your requirements.

what should be displayed on the _index page:

  • a list of countries each represented by maybe
    • a headline, one teaser image,
    • a link to the actual gallery for that country.

or

  • all images of all countries

or is it just one page showing all images?

what should be on each of the country.md files?

  • all the images for a country ?
  • any additional info for each image

or

  • is that not related to your issue and something different

where are the fotos of each country?

do you want to automatically list all images or manually maintain which images , order, …

and whats that shortcode?

btw you code ranges over pages and the params are on the list page so $.Params.gallery.deutschland.thumb should work … but I guess that’s not really what you want (see above) :wink:

and see below the list of related pages to your issue

3

The first of your options is right.

In the _index.md file I want one image from every country and if I click on it then go to all images of that country. My images are stored in the static folder and I want to choose the order of the images.

That is what I have in germany.md:

+++
draft = false
title = 'Fotos Deutschland'
description = 'Fotos aufgenommen in Deutschland von M.'

[params.gallery.deutschland]
headline = "Germany"
gallery_section = "deutschland_section"


[[params.gallery.deutschland.images]]
caption = "Germany - Foto #1"
thumb = "/images/photos/deutschland/deutschland-01-thumb.webp"
image = "/images/photos/deutschland/deutschland-01.webp"
id = "deutschland_Photo_1"

[[params.gallery.deutschland.images]]
caption = "Germany - Foto #2"
thumb = "/images/photos/deutschland/deutschland-02-thumb.webp"
image = "/images/photos/deutschland/deutschland-02.webp"
id = "deutschland_Photo_2"

[[params.gallery.deutschland.images]]
caption = "Germany - Foto #3"
thumb = "/images/photos/deutschland/deutschland-03-thumb.webp"
image = "/images/photos/deutschland/deutschland-03.webp"
id = "deutschland_Photo_3"
+++

{{< gallery "deutschland" >}}
{{< modal >}}

and that is what my _index.md look like:

+++
draft = false
title = 'Fotos'
description = 'Fotos aufgenommen von M.'


[params.gallery.deutschland]
headline = "Germany"
gallery_section = "deutschland_section"

[[params.gallery.deutschland.images]]
    caption = "Germany - Foto #1"
    thumb = "/images/photos/deutschland/deutschland-01-thumb.webp"
    image = "/images/photos/deutschland/deutschland-01.webp"
    id = "deutschland_Photo_1"



[params.gallery.niederlande]
headline = "Netherlands"
gallery_section = "niederlande_section"

[[params.gallery.niederlande.images]]
    caption = "Netherlands - Foto #1"
    thumb = "/images/photos/niederlande/niederlande-01-thumb.webp"
    image = "/images/photos/niederlande/niederlande-01.webp"
    id = "niederlande_Photo_1"


[params.gallery.daenemark]
headline = "Denmark"
gallery_section = "daenemark_section"

[[params.gallery.daenemark.images]]
    caption = "Denmark - Foto #1"
    thumb = "/images/photos/daenemark/daenemark-01-thumb.webp"
    image = "/images/photos/daenemark/daenemark-01.webp"
    id = "daenemark_Photo_1"

+++


{{< gallery "deutschland" >}}
{{< gallery "niederlande" >}}
{{< gallery "daenemark" >}}
4

mmh, if it were mine I would go with layouts instead of shortcodes.

code Updated to match Multilingual range of content - #6 by irkode

if you need additional stuff between the galleries than code put the code in shortcoddes.

the gist is - move all of the country properties to the gallery itself for a single point of true

changes to germany only need to be done in one file. and will be pulled in by the main _index automatically

something like:

_index.md
+++
draft = false
title = 'Fotos'
description = 'Fotos aufgenommen von M.'
+++
layout for _index.md
{{/*  maybe use .ByWeight (define on the pages) , maybe sort alphabetical or a simple list for full control*/}}
{{ range .Pages }}

  {{/* all attributes defined on the country page */}}

  <h2>{{.Params.Headline}}</h2>
  
   {{ with index .Params.gallery (sub .Params.teaserImage 1) }}
    THUMB: {{ .thumb }}
    IMAGE: {{ .image }}
  {{ end }}
    <a href={{.RelPermalink}}>See all of ...</a>
{{ end }}
germany/index.md
+++
title = 'Fotos Deutschland'
description = 'Fotos aufgenommen in Deutschland von M.'

[params]
headline = "Germany"
teaserImage = 1

[[params.gallery]]
caption = "Germany - Foto #1"
thumb = "/images/photos/deutschland/deutschland-01-thumb.webp"
image = "/images/photos/deutschland/deutschland-01.webp"
id = "deutschland_Photo_1"

[[params.gallery]]
caption = "Germany - Foto #2"
thumb = "/images/photos/deutschland/deutschland-02-thumb.webp"
image = "/images/photos/deutschland/deutschland-02.webp"
id = "deutschland_Photo_2"

[[params.gallery]]
caption = "Germany - Foto #3"
thumb = "/images/photos/deutschland/deutschland-03-thumb.webp"
image = "/images/photos/deutschland/deutschland-03.webp"
id = "deutschland_Photo_3"
+++

layout for germany/index.md

<h2>{{ .Title }}</h2>
{{ range .Params.gallery }}
  caption: {{ .caption }}
 ...
{{ end }}

if your images really follow these naming convention , you already have an order and can completely automate these.
I would move or mount the images to assets (or the country folder as page resource, to use [rR]esources.get “images/germany/*.webp” (if your images sort order is the display order.

completely untested just an idea: but for the definition in frontmatter have a look at resources metadata in frontmatter
where you can map page resourcses to names/and attributes

maybe of target … missing lot of context with your actual intention :wink:

5

Thanks so far..

I can see all image if I visit: https://example.com/fotos/germany that is nice :slight_smile:

RelPermalink works also, but headline and thumb do not.

On the fotos/list.html I get this error:

execute of template failed at <.Headline>: can’t evaluate field Headline in type page.Page

This is what my fotos/list.html looks like:

{{ define "header" }}

<h1 class="main-headline">{{ .Title }}</h1>

{{ end }}

{{ define "main" }}

{{ range .Pages }}

    <h2>{{ .Headline }}</h2>

    <img src="{{ .thumb }}">

    <a href="{{ .RelPermalink }}">See all of ...</a>

{{ end }}

{{ end }}

my _index.md:

+++

draft = false

title = 'Fotos'

description = 'Fotos aufgenommen von M.'

+++

I guess, that is because in my _index.md file I do not have a headline. But how can I access or get this in my fotos/list.html?

6

oh. sry.

should be under

[params]
headline = "Germany"

in the country front matter

and accessed with {{.Params.Headline }} in both partials.

same for the teaserImage

to access the gallery entries from within the range inside the main index file use .Params.gallery use index for individual images and then access the fields.

code updated in Multilingual range of content - #4 by irkode

7

ahh.. I get another error now :winking_face_with_tongue:

executing “main” at <.Params.gallery.image>: can’t evaluate field image in type interface {}

My code:

{{ define "header" }}
<h1 class="main-headline">{{ .Title }}</h1>
{{ end }}

{{ define "main" }}
{{ range .Pages }}

    <h2>{{ .Params.Headline }}</h2>

    <img src="{{ .Params.gallery.image }}">

    <a href="{{ .RelPermalink }}">See all of ...</a>

{{ end }}
{{ end }}

and If I switch to English the content(images) are not there..

8

c’mon @malde11 you are not a fresher so I thought that one would do :wink: especially as I wrote I have updated the code.

Blindly copying some snippets to yours is mostly not a good idea.

have a look at the complete picture of my post above

  • one list page / one gallery example page
  • two layouts.

check out the front matter and how it relates to the code

hint: [[params.gallery]] is a slice of maps (you set it up)

I leave it up to you why there’s a sub statement in my code

regarding missing english. Check if all is really set up as for the german page. without having the source no way.

and again if one is working I thought you are able to duplicate. if not show your code (gallery + pages)

HINT: code defensive. The shown code works, but is for the gist not a – production ready – fail safe – theme layout code. No error/empty checking at all

9

Sorry.. I got it:

{{ define "main" }}

{{ range .Pages }}

    <h2>{{ .Params.Headline }}</h2>
    <a href="{{ .RelPermalink }}">
        <img src="{{ .Params.TeaserImage }}">
    </a>
    <a href="{{ .RelPermalink }}">See all of ...</a>
{{ end }}
{{ end }}

only the English part is missing.. :stuck_out_tongue:

10

not really :wink: the teaser image in my example is just the number of the image to use on the gallery list.

11

I have given the teaser a string/path to the image. For example:

teaserImage = “/images/photos/deutschland/deutschland-01-thumb.webp”.

And for the English version I have got a _shortcode, but I do not understand all of them:

{{/*

Renders the content of the current page's translation in the specified language.
@param {string} The language key of site from which to retrieve the translation.
@returns {template.HTML}
@example {{< content de >}}
*/}}

{{ with $sourceLanguage := .Get 0 }}
  {{ if eq $.Page.Language.Lang $sourceLanguage }}
    {{ errorf "The positional parameter passed to the %q shortcode must not be the language key of the current site. See %s" $.Name $.Position }}
  {{ else }}
    {{ with index (where $.Page.Translations "Language.Lang" $sourceLanguage) 0 }}
      {{ .Content }}
    {{ else }}
      {{ errorf "The %q shortcode was unable to find a %q translation of the %q page. See %s" $.Name $sourceLanguage $.Page.Path $.Position }}
    {{ end }}
  {{ end }}
{{ else }}
  {{ errorf "The %q shortcode requires a positional parameter indicating the source language key. See %s" $.Name $.Position }}
{{ end }}

I understand that if I write: {{< content de >}} to an English markdown file, he will take the content from the German version. So both have the same content.

Here is an example of the English _index.md:

+++

draft = false
title = 'Photos'
url = 'photos'
description = 'Photos taken by M.'
+++

{{< content de >}}

But somehow it is not working for the fotos folder.

12

i used the position to not have to duplicate the path and full access to all the params for that image… question of maintainability.

the code looks like something for a multi language site. you never mentioned and no sign in your examples that germany is more than the location where the picture was taken…

so without real multi lang setup that is not the code you are looking for

13

hmm.. the title of this post :sweat_smile:

But it is OK.. I do not need everything translated. Only the links and urls would be fine.

That is my folder structure:

Screenshot 2026-09-29 201628
Screenshot 2026-09-29 201628522×1060 40.5 KB

Everything is working but not the pages in the english folder(fotos).

+++
draft = false
title = 'Photos Denmark'
url = 'photos/denmark'
description = 'Photos taken in Denmark by M.'
+++

{{< content de >}}

This is an example of the daenemark.md from the English folder.. the title is displayed but not the content.

Screenshot 2026-09-29 203232
Screenshot 2026-09-29 203232730×354 31.7 KB

The source of the image is empty..

14

you are right, missed the “en” in the first folder structure :blush:

educated guess looks like you reorganized the range/with/ order?

your code, setup, frontmatter shortcodes all contribute to the final result. Sry but that’s too much moving factors for me over the chat. And your code may be based on mine but there are at least subtil differences…

Trying to replicate yours is not an option. Please share your repo (privately if you want).

need to stop guessing around to assist.

p.s. with that setup moving the country gallery array to a data file or page resource might be a good option.

  • central source `data/gallery/country.[json|yaml]
  • just pages to render - no need to “copy content”
  • allows (easier) translation the country pages

moving/mounting images to headless fotos might also be a design possibility (allow for using getResource and the embedded render hook (also without image duplication)
15

OK.. I am on bitbucket.

Never shared or worked together with git in a team. I will try to invite you to my repo tomorrow. If you got time..