# Range \<$image.Resize\>: nil pointer evaluating resource.Resource.Resize

**URL:** <https://discourse.gohugo.io/t/range-image-resize-nil-pointer-evaluating-resource-resource-resize/41535>\
**Category:** support\
**Created:** [November 19, 2022, 11:19am UTC](https://discourse.gohugo.io/t/range-image-resize-nil-pointer-evaluating-resource-resource-resize/41535 "2022-11-19T11:19:11Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Terramoto](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/terramoto/32/18217_2.png) [@Terramoto](https://discourse.gohugo.io/u/Terramoto)\
**Post date:** [November 19, 2022, 11:19am UTC](https://discourse.gohugo.io/t/range-image-resize-nil-pointer-evaluating-resource-resource-resize/41535/1 "2022-11-19T11:19:11Z")

</div>

Hello,

Noob here, my layout runs through a range of RegularPages and on some of them i have the front matter variable featured\_images set to the image location. Then within the range scope i have the following:

```auto
{{ printf "%s" .Params.featured_image }}
  {{ with .Params.featured_image }}
    {{ $image := resources.Get . }}
    {{ $image := .Resize "200x200" }}
    <img src="{{ $image.RelPermalink }}">
  {{ end }}

```

Which is generating the post topic. The printf retuns image paths for the posts that have the front matter variable and `%!s(<nil>)` for the ones that don’t, so it looks like the `.Get` (or `.GetMatch`) is not getting the images even though the `with` confirms its existence. Do the images need to be at a certain location like resources or assets?

---

<div class="post-metadata">

**Author:** ![chrillek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/chrillek/32/19797_2.png) [@chrillek](https://discourse.gohugo.io/u/chrillek)\
**Post date:** [November 19, 2022, 11:45am UTC](https://discourse.gohugo.io/t/range-image-resize-nil-pointer-evaluating-resource-resource-resize/41535/2 "2022-11-19T11:45:06Z")

</div>

The image is not where you think it is. Your `with` doesn’t help because it only checks if the parameter contains a value. You’d need something like

```auto
{{ $image := resources.Get .Params.featured_image}}
{{ with $image }}
...
{{ end }}

```

> [@Terramoto](#):
>
> Do the images need to be at a certain location like resources or assets?

Yes. If you want to use `resources.Get`, the images have to be in `/assets`, as described in the documentation. Alternatively, use page bundles (again: [read the documentation on that](https://gohugo.io/content-management/page-resources/) and use `.Resources.GetMatch`.

For future questions: Trimmed down information like in your case is often _not_ enough to answer. A sentence like “the front matter variable featured\_images set to the image location” doesn’t tell anything unless you say _what_ this image location is. Many people here want you to provide a link to your repository so they can look at the complete site.

---

<div class="post-metadata">

**Author:** ![jmooring](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jmooring/32/4214_2.png) [@jmooring](https://discourse.gohugo.io/u/jmooring)\
**Post date:** [November 19, 2022, 5:28pm UTC](https://discourse.gohugo.io/t/range-image-resize-nil-pointer-evaluating-resource-resource-resize/41535/3 "2022-11-19T17:28:56Z")

</div>

You need to code defensively for the absence of (a) the front matter parameter, and (b) the image itself.

```nohighlight
{{ with .Params.featured_image }}
  {{ with resources.Get . }}
    {{ $alt := path.BaseName .Key | humanize | strings.FirstUpper }}
    {{ with .Fill "200x200" }}
      <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="{{ $alt }}">
    {{ end }}
  {{ end }}
{{ end }}

```

Other notes:

- With the `.Resize` method, if you specify both width and height, the resulting image will be disproportionally scaled unless the original image has the same aspect ratio. I think you want to use `.Fill`, `.Crop`, or maybe `.Fit`. See [documentation](https://gohugo.io/content-management/image-processing/#image-processing-methods).
- If you name your images something like “white-kitten.jpg”, you can generate the `alt` attribute based on the filename (e.g., white-kitten.jpg → `alt="White kitten"`).

---

<div class="post-metadata">

**Author:** ![Terramoto](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/terramoto/32/18217_2.png) [@Terramoto](https://discourse.gohugo.io/u/Terramoto)\
**Post date:** [November 19, 2022, 10:13pm UTC](https://discourse.gohugo.io/t/range-image-resize-nil-pointer-evaluating-resource-resource-resize/41535/4 "2022-11-19T22:13:55Z")

</div>

I’m just learning, emacs, orgmode, ox-hugo and hugo, and i suspect that’s where the issue is.  
ox-hugo suggests using the static folders to link the images, but for these methods the images need to be in assets or resources folders, might be best to setup this as page bundles. Moved everything into the assets folders and now everything is working properly, will add the extra with line to account for image existence.

Many thanks!

---

<div class="post-metadata">

**Author:** ![system](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/system/32/1_2.png) [@system](https://discourse.gohugo.io/u/system)\
**Post date:** [November 21, 2022, 10:14pm UTC](https://discourse.gohugo.io/t/range-image-resize-nil-pointer-evaluating-resource-resource-resize/41535/5 "2022-11-21T22:14:42Z")

</div>

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