Pictures from 'subpages' (name.md) on Listpage (_index.md)

support
1

Hello all,

I have pages with frontmatters

---
indeximage: picture.jpg

---

The pages are listed on an index page “_index.md”.
I have access to the frontmatter, the value “picture.jpg” of the key “indeximage” is output.
The display of the picture on the index page does not work.

I try it with

<img src="/{{ .Page.File.Dir }}{{ .Page.Params.indeximage }}">

In the source code of the created page I find the line

<img src="./pens%5cfend%5cfend-normix-pat-index.png">

What do I need to do to get the following output?

<img src="./pens/fend/normix-pat-index.png">

Thank you very much for your help and best regards
rufus42

(Text translated from German with DeepL Translate: The world's most accurate translator (free version)

edit
Renamed “Pictures on Listpage (_index.md)” to “Pictures from ‘subpages’ (name.md) on Listpage (_index.md)”

2

It depends on how you store the images.

  1. For page resources

Structure

content/
  page-1/
    index.md
    picture.jpg

{{ with .Page.Params.indeximage }}
  {{ with $.Page.Resources.GetMatch . }}
    <img src="{{ .Permalink }}">
  {{ end }}
{{ end }}
  1. For /static images

Structure

static/
  images/
    picture.jpg

{{ with .Page.Params.indeximage }}
  <img src="{{ . | absURL }}">
{{ end }}
3

Hello @razon

Thank you very much for your answer.
Unfortunately it does not solve my problem.

My file structure is

content\pens_index.md
content\pens\fend\fend-normix-pat.md
content\pens\fend\fend-normix-pat-index.png

My problem is the output of

** **<img src="./pens%5cfend%5cfend-normix-pat-index.png">** **

instead of

** **<img src="./pens/fend/fend-normix-pat-index.png">pens** **

Many greetings
rufus42