Struggling with images

I want to access one image, which i define in my .md file.

So my structure is the following:


This has an and a subfolder images with the content

Now i want to define in my frontmatter my image.
Which path do i need to give my frontmatter variable “mainimage” to access my mainimage.jpg from the images folder?
I tried it with that:
mainImage: “/images/mainimage.jpg”

But as soon as i try to access it via the following:
{{ $path := .Params.mainImage }}
{{ $thumb := resources.Get $path }} I will get an error

If this is a leaf bundle, rename to

If this is a branch bundle, the images must be adjacent to the file, not in a subdirectory.

The resources.Get function retrieves a global resource (e.g., an image in the assets directory).

Use the .Resources.GetMatch method to retrieve a page resource.

{{ $path := resources.Get .Params.mainImage }}
{{ $thumb := $path }} 

I have moved my image into the folder - still no luck - Is there somewhere a good tutorial which shows the usage of images?*

I can not work with static images, as i want also to convert them into webp in a later step.

So my actual solution is:
{{ $path := .Params.mainimage }}
{{ $image := .Resources.Match $path}}

    {{ with $image }}
     {{ range . }}
     {{ $resized := .Resize "300x"}}
     <img src="{{ $resized.Permalink}}"/>
     {{ end }}
     {{ end }}

In my frontmatter i have
mainimage: “images/main_logo.jpg”

But this is not a nice solution as i have a range for just one item.

└── post/
    └── post-1/
        ├── images/
        │   ├── b.jpg
        │   └── main_logo.jpg
{{ with .Params.mainimage }}
  {{ with $.Resources.GetMatch . }}
    {{ $resized := .Resize "300x" }}
    <img src="{{ $resized.Permalink }}">
  {{ end }}
{{ end }}


The .Match method returns a slice of images, even if there is only one match.

The .GetMatch method returns a single image.

Thank you for your explanation.

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.