Okay
  Public Ticket #3635702
Responsiveness
Closed

Comments

  •  2
    Vicki started the conversation

    Do you have any documentation on adjusting sliders/layouts for different devices/widths? I don't see any way to do that in the visual interface.

    I'd like to know that in general, but my current problem is buttons that display well on all devices except for mobile. They are way too small on mobile. How do I make them bigger just for mobile width? Is there a way to create media queries from within the wordpress interface?

  •  137
    George replied

    Hello Vicki,

    Thank you for getting in touch with us. My name is George and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.

    Responsiveness and device specific layers in general:

    If you would like to have layers with different style and/or properties on mobile devices and desktop, I'll suggest you to use device specific layers. If you create a layer, you can set device visibility under LAYERS -> CONTENT, which means that the selected layer will appear only on the selected device type. You can select and combine desktop, tablet and mobile devices.

    If you - for example - disable a layer on desktop, it will disappear from the slider if you are viewing it on desktop.

    It is important to know, that in this case the layer will temporarily disappear also in the editor and it will be faded out in layers list. The reason of that is the editor is showing the content in the desktop device view by default. You can switch between the different device views with the device selector.

    Layers with all device visibilities enables will show in all device view, but - for example - layers with only mobile device visibility enabled will show only if you are switching to mobile device view.

    I suggest you to duplicate layers you would like to behave differently on separate devices and set different device visibilities for them. After that you can set them different style properties and transitions.

    The canvas size in the editor won't change by selecting different devices, but you can easily check the layout if you run a Project Preview.

    About your current problem: If a layer with a text is too small on mobile devices, but the style and transitions of this layer should remain, you can choose to set a minimum font size for that layer or you can also set a minimum responsive ratio. Both are handy to prevent the font (and also the layer) from being smaller.

    I hope this helps.

    Attached files:  layer-style-min-responsive-ratio.png
      layer-style-min-font-size.png
      layer-toggle-device-visibility.png
      device-wiev.png

    Best Regards,
    George | Kreatura Dev Team

  •  2
    Vicki replied

    Thanks. That's what I ended up doing - creating 2 sets of buttons and controlling the visibility.

    I tried Revolution Slider - oh my. The same slideshow that loads instantly with Layerslider, took 10 or more seconds to load with Revolution. 

  •  137
    George replied

    Thank you for the feedback. Is there anything else I can help you with?

    Best Regards,
    George | Kreatura Dev Team

  •  2
    Vicki replied

    That was it. Thanks.