I am wondering if there is a way to create different layouts for desktop, mobile and tablet views for slides.
I'd like to create custom layouts for all 3 for the same slide and not just a scaled down version of the desktop slide for tablet and mobile. Right now the text is hard to read on mobile version and I'd like to change it so it's a vertical format for the mobile slide.
Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.
Since version 6 you have the option to display layers only on certain devices (desktop, mobile, tablet). This new feature gives you the option to create separate layers and layouts for mobile and desktop view in the same slide, and only show them on the required device. Furthermore, you also have the option to set a minimum font size for texts on mobiles.
Additionally to the device specific layers, you could also build two sliders with different sizes or with different content for desktop/mobile, include them both to the site, and only display them (using the Hide over and Hide under options) on the required device.
When I add the separate desktop, tablet and mobile sliders on the page layout I get a blank space showing on the mobile version where the tablet slider is and is set to be hidden. And on mobile I see the a blank space where the tablet version would have been.
All the layers are hidden for the respective other views (i.e. desktop and tablet are turned off for the mobile slider) but it still shows the space above or below the slider. How can I fix this?
I have checked your site again on mobile (tested both iOS and Android devices), but for me there is no blank space above the sliders. They are switching out properly on mobile as well.
Have you managed to fix the problem in the meantime ?
In case not, could you please specify on what OS/browser/device are you experiencing this exactly ?
Furthermore, as I can see you are using a page builder to add the sliders. Please make sure that you are adding all three sliders to the same 'place' (element/block) and not next to each other.
Yes, I did get it figured out eventually. I had to use the hide over and hide under features as clicking to show layers on desktop, tablet or mobile wasnt working for me. Thanks for the help.
Can I ask you Angela how did you set up the hide over and hide under features? I'm trying to do set different slideshows for devices and have the same problem as you.
I am wondering if there is a way to create different layouts for desktop, mobile and tablet views for slides.
I'd like to create custom layouts for all 3 for the same slide and not just a scaled down version of the desktop slide for tablet and mobile. Right now the text is hard to read on mobile version and I'd like to change it so it's a vertical format for the mobile slide.
Hello Angela,
Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.
Since version 6 you have the option to display layers only on certain devices (desktop, mobile, tablet).
This new feature gives you the option to create separate layers and layouts for mobile and desktop view in the same slide, and only show them on the required device. Furthermore, you also have the option to set a minimum font size for texts on mobiles.
Additionally to the device specific layers, you could also build two sliders with different sizes or with different content for desktop/mobile, include them both to the site, and only display them (using the Hide over and Hide under options) on the required device.
Creating a new slide for mobile worked great thanks!
I am actually having one problem.
When I add the separate desktop, tablet and mobile sliders on the page layout I get a blank space showing
on the mobile version where the tablet slider is and is set to be hidden.
And on mobile I see the a blank space where the tablet version would have been.
All the layers are hidden for the respective other views (i.e. desktop and tablet are turned off for the mobile slider) but it still shows the space above or below the slider. How can I fix this?
Page is here: dev.mezzalunadesign.ca
This is what it looks like on mobile and on desktop when I resize the browser: (there should not be a white space above the garage doors slider)
And this is how Ive inserted the sliders on my page layout
I have checked your site again on mobile (tested both iOS and Android devices), but for me there is no blank space above the sliders. They are switching out properly on mobile as well.
Have you managed to fix the problem in the meantime ?
In case not, could you please specify on what OS/browser/device are you experiencing this exactly ?
Furthermore, as I can see you are using a page builder to add the sliders. Please make sure that you are adding all three sliders to the same 'place' (element/block) and not next to each other.
Yes, I did get it figured out eventually. I had to use the hide over and hide under features as clicking to show layers on desktop, tablet or mobile wasnt working for me. Thanks for the help.
Thank you for the feedback, glad you could solve the problem. If you need further assistance please let us know.
Can I ask you Angela how did you set up the hide over and hide under features? I'm trying to do set different slideshows for devices and have the same problem as you.
Many thanks
Joanna