Hi
I’ve recently updated my production instance to v3.20.3 from v3.19.2 and something weird happened with my images.
When I write content using Markdown component and use:

everything is fine and image is displayed properly. When I use the Image
component, while still the the admin panel my image shows up correctly, but it doesn’t load if I preview my post.
Now I looked at HTML that’s being rendered and noticed that it looks like this
<figure class="kg-card kg-image-card kg-card-hascaption">
<img src="/content/images/2020/06/107_0724.JPG" class="kg-image" alt=""
srcset="/content/images/size/w600/2020/06/107_0724.JPG 600w, /content/images/size/w800/2020/06/107_0724.JPG 800w">
<figcaption>my caption</figcaption>
</figure>
Where does the srcset
come from? All my images sit in /content/images/
, there’s no /content/images/size/
on my server.
Another weird part is, I updated my local version of Ghost to the same one and it’s all fine. On my local machine, in dev mode HTML is rendered as I’d expect it, like that
<figure class="kg-card kg-image-card kg-card-hascaption">
<img src="/content/images/2020/06/107_0724.JPG" class="kg-image" alt="">
<figcaption>my caption</figcaption>
</figure>
Any idea what’s going on?
Hi @SixBytesUnder 
srcset
was added in a recent update to content images so they can make use of modern responsive image loading. Because the update is very new you’re probably seeing both implementations between versions, as for existing images they will remain the same and won’t have a srcset
attribute. You can read more about the srcset attribute here.
Is there anything that’s causing problems for you with how images are rendering? I’d be happy to help with any visual presentation issues you’re having 
Hi @DavidDarnes
Thanks for your comment. Well the problem is, images are not showing at all on frontend 
Because the /size/… folder doesn’t exist at all, browser is trying to upload one of those images and failing because they don’t exist.
I understand what this is used for in HTML, but why Ghost is not creating those resized images, but still requesting them?
I see. This could be an issue with your underlying installation in that case. There should be a sizes directory as feature images already have srcset
applied as shown here. You may need to adjust permissions so Ghost is able to create those directories 
srcsets get generated in HTML only under specific conditions ie: when the site url and prefix match for the image. If you are not getting them in the HTML and you expect you should you may need to check your hostname and paths.
The individual images are generated specifically during a request. It should “fix itself” as those srcsets are requested. Try going to one manually and see if it creates it in the backend storage.
That’s the way I understand it, anyway.
@DavidDarnes that’s interesting. I did not have “image_sizes” section in my package.json at all. I’m using a custom built theme. Still if I have no size images specified, why ghost is forcing them upon me in HTML?
@elijahsgh sorry, maybe I didn’t explain that properly. If we take this as an example
<figure class="kg-card kg-image-card kg-card-hascaption">
<img src="/content/images/2020/06/107_0724.JPG" class="kg-image" alt=""
srcset="/content/images/size/w600/2020/06/107_0724.JPG 600w, /content/images/size/w800/2020/06/107_0724.JPG 800w">
<figcaption>my caption</figcaption>
</figure>
We have three image URLs:
- /content/images/2020/06/107_0724.JPG - the original one, that works just fine when accessed directly in the browser.
- /content/images/size/w600/2020/06/107_0724.JPG - there is no “size” folder on my server and subsequently when I try to access that URL in the browser directly it throws a 404 and does not generate any files for me.
- /content/images/size/w800/2020/06/107_0724.JPG - same as point 2.
Let me ask a different question. Can I force Ghost to stick with just plain old simple src="" and do not generate srcset="" at all?
If it’s already existing content you could move it (change the path) so it doesn’t match Ghost’s Local Content path. It won’t add the srcsets. Otherwise it should generate the srcsets and as soon as it is requested it should create it. If you navigate to the srcset links do you just get a 404? What storage adapter are you using?
That’s the problem for some reason, it doesn’t generate the srcset images at all, and when I directly access one of the sized images it throws a 404 and still does not generate it.
I’d be super happy if I can make Ghost just not add srcset to my HTML and just do the plain old src.