1. Resizing Behavior
1. Auto Responsive
Choose to make the layer responsive by default (layer will resize when slider resizes).
2. Child Elements Responsive
If the layer contains additional content (raw HTML, shortcode from other plugin, etc.), the slider will attempt to resize all nested elements.
2. Boxed (Grid Based) vs. Full-Width (Slide Based) Alignment
Layer Alignment is particularly useful for when using Full Width slider, as sometimes you want your content to align to the sides of the screen as opposed to your slider’s “Layers Grid” size.
The example slider below has a “Full Width” Slider Layout and a “Layers Grid” of 600×400. When the screenshots were taken, the screen size was 900px wide, so the slider had also “responded” to this width.
Align -> Grid Based (boxed)
Layer will always be aligned and positioned based on the slider’s grid size (i.e. 115px from the left of the Layer’s Grid boundaries).
Align -> Slide Based (full-width)
Alignment and positioning of Layers will always be based on the slider’s actual size (i.e. 115px to the left of the screen).
3. Responsive Offset / Positioning
In the following example, the layer has a “top left” alignment, with a 50px offset from the top and left.
Responsive Offset: ON
When the slider is resized down by 50%, the Layer’s original “Offset” values are also reduced by 50%.
Responsive Offset: OFF
When the slider is resized down by 50%, the Layer’s original “Offset” values are NOT reduced or changed.
4. Image Layers: Lazy Load Settings & Source Type
1. Lazy Loading:
Default Settings – Image will be loaded according to the slider’s global Lazy Load setting.
Force Lazy Loading – Lazy Load the image regardless of global Lazy Load setting.
Ignore Lazy Loading – Do not Lazy Load the image regardless of global Lazy Load setting.
2. Source Type:
Choose which version of the image should be loaded. Often “Original” can equal a very large file size, so usually “Large” or “Medium” is a good choice for optimal loading performance.
Choose “Default Setting” to use the slider’s global Image Source Size setting. Or override the default setting with one of the other choices.