Please help me resize my images

support
#1

I get stuck in this comand - with this indications and many others similar here around the forum.
It looks like Hugo cannot find the image ( and cannot process with .Resize ) despite of the name, the relative path I try to provide or the absolute path.

Any help? :slight_smile:

Can I use this kind of libraries that need to be installed in netlify according to you?
My main concerns about images are bound to what I can do in netlify or not

Shortcode for resizing images, lazy loading, AND progressive loading, all in one!
#2

See the Requesting Help guidelines.

If you cannot figure it out then you need to share your project in the forum.

Netlify has its own pipeline for optimizing assets, (see here). Your question is better suited for the Netlify forum.

#3

The help was linked to the code of the other topic now splitted.
Anyway, here is the image.html shortcode:

{{ $caption := .Get "caption"}}
{{ $classes := .Get "classes"}}

{{ $image := (.Page.Resources.GetMatch (.Get "src")) }}

{{ $placeholder := $image.Resize "48x q20" }}

{{ with $.Page.Resources.GetMatch (.Get "src") }}
<figure class="progressive_figure {{$classes}}" data-imgset="{{ (.Resize "640x").RelPermalink }} 320w,
  {{ (.Resize "1024x").RelPermalink }} 600w,
  {{ (.Resize "1600x").RelPermalink }} 2x"
  data-src="{{ (.Resize "1600x").RelPermalink}}" >
  <div class="placeholder">
    <img class="img-small" src="{{ $placeholder.RelPermalink }}" alt="{{ .Get "alt"}}" />
  </div>
  <figcaption>{{ $caption }}</figcaption>
</figure>
{{ else }}
could not find image
{{ end }}

I use the shortcode as following:
{{< image src="IMG_0724.jpg" alt="Road to the town" caption="Road to the town">}}

It returns:

execute of template failed: template: shortcodes/image.html:6:25: executing "shortcodes/image.html" at <$image.Resize>: nil pointer evaluating resource.Resource.Resize

The problem I reckong is bound to .Page.Resources.GetMatch but providing the absURL of the image provided it doesn’t change the error at all :confused:

#4

The Help topic is mentioning that a user needs to share the project repo when requesting help.

Descriptions are not good enough, we need to see the full context of the project and we do not have the time for guesswork.

If you cannot share the project in question, then you need to share a minimal project reproducing the problem. Otherwise I do not have further time for discussion.

#5

Here is my sample project:
[deleted]
as you can see it returns error where I wrote in the first post

#6

As per the Docs:

The image is a Page Resource, and the processing methods listed below do not work on images inside your /static folder.

#7

So how could I do? Should I move pictures somewhere else into the project (where?) :confused:

#8

You are supposed to read the documentation and search the forum before asking questions.

Hint: Look at Page Bundles in the documentation.

I’m sorry but the Requesting Help guidelines are quite specific and it seems that you have not really read them.

1 Like
#9