Responsive images from Content API?

Developer help
1

Ghost-CLI version: 1.13.1
Ghost version: 3.12.1

Is there a way with the content api to get the responsive images in the response? At least for the feature_image would be great, but other images in the post would be good too. I’ve only seen documentation on using responsive images in the Casper theme. But I’m simply using ghost via the content api to my Nuxt.js app.

2

Hey @tettoffensive :wave:

This isn’t available at the moment. Responsive images follow a specific URL structure, so you can probably add a transformer in your app, and if it Ghost natively adds it, remove it later. The limitations to this are that only sizes specified in the theme’s configuration are supported.

3

This is what I have done to get it working for the featured_image:

const sizes = [300, 600, 1000, 2000];
const srcset = sizes.map(size => `${props.sourceImage.replace('images', `images/size/w${size}`)} ${size}w`).join(', ');
1 Like