I just purchased your slider and already implemented a few instances of it based on some templates you have. Is there a way I can make the existing slider mobile responsive or do I have to create a separate slider that is only visible for mobile? For example, when I go to your template for this one on mobile it shows up how I would want to on my website: https://layerslider.kreaturamedia.com/sliders/marketing-page-pack/
Right now on my website it does not show up like that. Do I need to create a separate slider to display it like this and only make it visible on mobile? What are the slider settings to make it look like how the template above looks on mobile? It seems like it shows everything naturally on mobile but when I look at the same slider on mobile for my website (using that template) it looks so small.
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.
Yes, we've used a separate version of the slider for mobile in that package. LayerSlider is mobile friendly, so it will resize your slider and its content proportionally, but unfortunately in some cases they become too small or do not fit the environment because of the aspect ratio changes. In case like this you have two options, the device specific layers or building a separate slider.
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.
Additionally to the device specific layers, you could also build two sliders with different sizes or with different content for dekstop/mobile, include them both to the site, and only display them (using the Hide over and Hide under options) on the required device.
Where is that bar located that allows you to select which device the slide is displayed on? I could only find a selector that toggles yes/no to show on mobile devices in the slide settings area and then manually specify if a width is over a certain amount than don't show mobile. I don't like doing it that way.
How do I make the slide conform to the width of the specific mobile device? If I set the width in the settings area than the slide is confirming to the width for me. I want the width to adjust to mobile device. If I select responsive mode is it adjusting to the device?
You can toggle separate layers with that bar, not slides. It's located in the Layers -> Content tab, right under the preview window.
I'm not exactly sure what would you like to achieve on mobile. Do you want the slider to always reach the sides of the browser ? In that case you're looking for the fullwidth layout. The responsive layout will scale the slider proportionally isntead.
Here's a little description on the layouts, the Responsive mode is used for 'normal' sliders that are not fullwidth or fullscreen. With this layout you can apply any custom size (width and height) for the slider so you can shape and position it freely anywhere (in,under,between other elements) on your site.
The Full Width layout will always stretch the slider's width to the sides of the browser window or to the sides of the slider's container, depending on your settings.
The Full Size mode will make the slider cover the whole browser screen, both width and height. But it also has additional types like the Hero Scene. The Hero scene mode will always match the slider's height to the viewport, so it will always cover 100% of the browser window's height, regardless of the viewing environment.
Hi. I have tried creating a new slides insider the slider. When I change the size of the slider it change both of the slide sizes. I want one size for the desktop and one size for mobile.
Hi,
I just purchased your slider and already implemented a few instances of it based on some templates you have. Is there a way I can make the existing slider mobile responsive or do I have to create a separate slider that is only visible for mobile? For example, when I go to your template for this one on mobile it shows up how I would want to on my website:
https://layerslider.kreaturamedia.com/sliders/marketing-page-pack/
Right now on my website it does not show up like that. Do I need to create a separate slider to display it like this and only make it visible on mobile? What are the slider settings to make it look like how the template above looks on mobile? It seems like it shows everything naturally on mobile but when I look at the same slider on mobile for my website (using that template) it looks so small.
Can you help give me some guidance?
Thanks,
Joe
Hello Joe,
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.
Yes, we've used a separate version of the slider for mobile in that package. LayerSlider is mobile friendly, so it will resize your slider and its content proportionally, but unfortunately in some cases they become too small or do not fit the environment because of the aspect ratio changes. In case like this you have two options, the device specific layers or building a separate slider.
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.
Additionally to the device specific layers, you could also build two sliders with different sizes or with different content for dekstop/mobile, include them both to the site, and only display them (using the Hide over and Hide under options) on the required device.
Thanks..few questions.
Where is that bar located that allows you to select which device the slide is displayed on? I could only find a selector that toggles yes/no to show on mobile devices in the slide settings area and then manually specify if a width is over a certain amount than don't show mobile. I don't like doing it that way.
How do I make the slide conform to the width of the specific mobile device? If I set the width in the settings area than the slide is confirming to the width for me. I want the width to adjust to mobile device. If I select responsive mode is it adjusting to the device?
You can toggle separate layers with that bar, not slides. It's located in the Layers -> Content tab, right under the preview window.
I'm not exactly sure what would you like to achieve on mobile. Do you want the slider to always reach the sides of the browser ? In that case you're looking for the fullwidth layout. The responsive layout will scale the slider proportionally isntead.
Here's a little description on the layouts, the Responsive mode is used for 'normal' sliders that are not fullwidth or fullscreen. With this layout you can apply any custom size (width and height) for the slider so you can shape and position it freely anywhere (in,under,between other elements) on your site.
The Full Width layout will always stretch the slider's width to the sides of the browser window or to the sides of the slider's container, depending on your settings.
The Full Size mode will make the slider cover the whole browser screen, both width and height. But it also has additional types like the Hero Scene. The Hero scene mode will always match the slider's height to the viewport, so it will always cover 100% of the browser window's height, regardless of the viewing environment.
Hi. I have tried creating a new slides insider the slider. When I change the size of the slider it change both of the slide sizes. I want one size for the desktop and one size for mobile.
Dear briannguyen,
Please open a new ticket for your case so we can address it properly. Thank you.