How to access leaf bundle images in shortcode

I have leaf bundle at www.mywebsite.com/posts/this-is-first-blog/

within /this-is-first-blog/ folder I have “images” folder and I have “hero.jpg”

I am creating shortcode

{{<image src="images/hero.jpg">}}

Inside image.html
{{ $myImage := .Page.Resources.GetMatch “images/hero.jpg”}}
<img src="{{.Get “src”}}" style=“max-width: {{$myImage.Width}}px”>

This is giving me error and not working.

Specifically .Resources.GetMatch and .Resources.Match both are not working.

Your code looks a little odd, but I don’t think that is your problem. Here is how I would have written it:

{{ $myImage := .Page.Resources.GetMatch (.Get "src") }}
{{ with $myImage }}
<img src="{{.Permalink }}" style=“max-width: {{.Width}}px”>
{{ end }}

I suspect the above in your case would produce nothing (as in: image not found), but at least you get rid of the error.

To tell you why the image is not found, you would have to share the link to the project source.

Thank you Thank you Thank you.
I literally added 50 images width manually. I got so sick of it. And I though there must be a better way.
And it’s working.

1 Like

Welcome to the community! Hugo is great!

1 Like