Skip Navigation

[Resolved] Setting archive image sizes

This support ticket is created 2 years, 11 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.

This topic contains 2 replies, has 2 voices.

Last updated by JoshuaD7497 2 years, 11 months ago.

Author
Posts
#2235181

Tell us what you are trying to do?

I have an archive page with posts which pull in a single image for each post. I've set this to be the thumbnail size (300 x 200px) so the images load up fast. This is very important to me. But when I examine the output on the website I see:

<img width="300" height="200" loading="lazy" src="hidden link" alt="Norfolk Outdoor Activity Centres" class="wp-image-660" srcset="hidden link 300w, hidden link 720w, hidden link 768w, hidden link 600w, hidden link 960w" sizes="(max-width: 300px) 100vw, 300px">

Because it sees my viewport as being over 960w I think it's pulling in the big image instead, when it doesn't need to.

And when I save an image from the page for examination, the image saved isn't the thumbnail image. It saves the 960px wide image. It doesn't matter what size viewport/device is being used, I always want it to use the thumbnail image only, as it will never be displayed in the grid more than 300 x 200, on any device, no matter what their screen size is. Why is it doing this?

Is there any documentation that you are following? No.

Is there a similar example that we can see?
This site does it correctly: hidden link

What is the link to your site? hidden link (but not currently viewable as not launched)

#2235357

Nigel
Supporter

Languages: English (English ) Spanish (Español )

Timezone: Europe/London (GMT+00:00)

I just checked something similar on my own test site, and I found that when I choose the thumbnail size then only that size is set in the img markup, but if I choose any of the larger sizes then the srcset and sizes attributes are added, as in your example.

You say you chose the thumbnail size, but that's actually the standard medium size in WordPress, not the smallest thumbnail size.

If you use a custom size rather than an existing registered size then the src is always set just to that size and the srcset and sizes attributes are not used.

So, in your case, you could set a custom size of 301px x 201px for example, and that image size would be used.

#2235375

Thanks Nigel.

Weird what you say about the 'thumbnail' size not actually being the smallest size as described in the Media options. But nonetheless, your solution worked.

Many thanks,
Josh.