Different images on mobile devices

Hi Vilnia,

Hope you’re doing well 🙂

Unfortunately this is not something possible out of the box but I think I have a workaround that could work for for you.

You can use CSS to hide the current image from smaller screens and then add different one as background.

It would look something like this:

@media screen and (max-width: 480px) {
    .wdpu-image img {
        display: none;
    }

    .wdpu-image {
        background: url('IMAGE_URL');
    }
}

Replace IMAGE_URL with the image you want to show on mobile and it will show on all screens below 480 pixels in width.

Hope this helps 🙂

Cheers,
Predrag

Awesome! Glad I could help 🙂

Have a great day!

Predrag