Responsive featured images

Hi @passij,

The featured image added in the Vilva theme are responsive. Can you please send us the link to your site where you are having issue with the featured image?

We will be looking forward to your reply.

Regards!

Hi @blossomthemessupport,

thanks for your answer! It’s correct, the featured image is responsive in terms of scaling. But it does not load different sizes of images per viewport. You can achieve that with the srcset/sizes attribute.

You can check your own demo theme: https://blossomthemes.com/theme-demo/?theme=vilva

If you check the source code for the featured image, you will see just an ordinary img tag: <img src="https://blossomthemesdemo.jpg" alt="" width="900" height="500" />

Compare it with an img tag within a post and you will find the srcset attribute. The browser then decides which image to load, dependent from the viewport of the browser. This is a reduced example:
<img srcset="elva-fairy-480w.jpg 480w, elva-fairy-800w.jpg 800w" sizes="(max-width: 600px) 480px, 800px" src="elva-fairy-800w.jpg" alt="" />

https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images

Thank you!
Pascal

• This reply was modified 3 years, 8 months ago by passij.
• This reply was modified 3 years, 8 months ago by passij.

Hi @passij,

Thank you so much for pointing on this feature that can be added to enhance the theme.

We will report it to the developer theme to see if this aspect can be added in future theme updates.

Regards!

Great!