Adapt Slides to mobile and tablet

Hello, I’m trying to adapt slidesto mobile and Tablet.
On elementor I have created mobile and tablet versions, but when I change the image it changes for all places, so how can I customize for mobile, tablet and desktop separatelly?

Hello,

Navigate to Slides > All Slides and edit the slide with Elementor you want to adjust.

Click the slide Settings in the Top-left corner and upload a separate image for mobile/Tablet/Desktop and change the content position.

See Screenshot for better understanding:https://postimg.cc/TpFkj1ps

Best Regards

Hello Aizaz,

It doesn’t work, when I change the image it will chang in all mobile/Tablet/Desktop

Hello,

Sorry to hear about the inconvenience. Kindly, please share your Site WP-ADMIN Login details in the Private Content field so that we can check this concern on your Site and help you out accordingly.

Best Regards

hello, thanks for replying!

here goes the credentials and the banners if you wnat to try

banners are:
– mobile https://centralpharmacy.pt/wp-content/uploads/2024/10/Mobile-3.png
– tablet https://centralpharmacy.pt/wp-content/uploads/2024/10/tablet-1.png

Hello,

By the way, we have one quick question we’d really appreciate your help with. 😊

Where did you first hear about WoodMart? We’re trying to better understand how customers discover WoodMart, and your answer is extremely valuable to us. It takes just one click: https://tally.so/r/rj8qWl

Thank you so much for your help! 🙏

Now, regarding your request, your issue has been resolved. I have created a new slider on your site and configured separate images for Desktop and Mobile, and it is working correctly.

Please check your site and review the Slide Settings to see how the responsive images are configured. You can use the same settings to customize the slider according to your requirements.

Best Regards.

Hello, Aizaz! Thanks for your help so far!

As I see the new slider you have createdis the “slider by woodmart”. All the others are as drafts.
I have attached more images so you can compare that the new slider is not with the same size of the original, also doesn’t have the border radius rounded as the template.
Could you do this changes so it can be as the template slider is? I really like the original design.

I’ll be glad to answer your query asap!

Looking forwar to hearing from you

Attachments:

You must be logged in to view attached files.

Hello,

Your issue has been resolved. Please check back your site and check the issue.

Best Regards

Aizaz, thank you very much for your help, it has been fantastic!

But I’m still having trouble with breakpoints, I’m not god, at all, with them.
I don’t know the size of the images I need nor the breakpoints to use, could you help me with that.

I have a wide screen and it fits well, but when I move to the laptop it doesn’t work fine, and the until it shrinks to mobile I still have trouble,

Could you advise me on that?

What are the sizes of the images and what breackpoints configuration should I use?

thank you

Hello,

Thank you so much for your kind words! I’m really glad to hear that the adjustments on your site helped.

Regarding your question about responsive layouts, It follow standard breakpoints, To keep your banners sharp and perfectly aligned across all devices—including smaller laptop screens—we recommend using image dimensions of around 1920x700px for Desktop/Laptop, 1024x600px for Tablet, and 600x800px for Mobile.

Additionally, make sure to set the Content Position settings and slide height separately for each screen size to adjust the slide in separate devices. Please try applying these image dimensions and responsive height settings, and if you still notice any layout shifting on laptop screens, feel free to share a screenshot so we can take a closer look for you!

Best Regards

[Author]

Posts