You can select layers in the Slide Editor, to open up the layer window.
In this article you can learn the common positioning and effect options for the layers. You can find these options at the Style tab of the layer window.
Tips for using the layer window
Hover/Normal and other special states
The hover, normal and any other states can be selected at some of the sections:
Opacity at the color picker
Within most color pickers, you can find an opacity chooser on the right:
Press the MORE buttons:
to see additional settings, which aren't used that often:
These options are available for layers which are in Default position.
The editing mode the layer is in.
The horizontal alignment of the layer. If there's no Max Width set, this options sets one automatically.
- Inherit: Inherits the align from the parent. By default this means left alignment.
- Left: Aligns the layers to the left.
- Center: Aligns the layers to the center.
- Right: Aligns the layers to the right.
The maximum width of the layer. You can also set it on the UI.
You can set a fix height for the layer, so it won't be auto anymore.
You can use margins to create distance between the layers.
⚠️ Warning: Margins are for creating distance, not for positioning. Use the Inner Align and Vertical Align on the layer's parent for positioning. Watch the dedicated tutorial video to learn more about the positioning.
These options are available for layers which are in Absolute position.
The editing mode the layer is in.
The horizontal align of the layer.
The vertical align of the layer.
The distance from the horizontal align position.
The distance from the vertical align position.
By default the positioning is responsive, which means its scaled with the slider. By turning it off you can have the
Top values as fixed distances. It's useful for example, when you want to have a layer that's always 10px away from the top-left corner.
Linked To Pro
You can link your Absolute layer to another layer on the same level. Learn more about the layer linking.
The width of the layer.
The height of the layer.
By default the sizing is responsive, which means its scaled with the slider. By turning it off, you can make your layer the set
Height on the device. It's useful for images which you use as design element.
You can hide this layer on the selected devices.
You can enable the layer parallax effect for this layer. The number you set will define the depth/strength of the effect
You can crop the layer's content.
☝️ Note: If you use the
Scroll option at the
Crop on your Content layer your Slide link will not work on click/touch action to allow scrolling through the Content layer's content on touch screen devices.
You can rotate this layer.
You can set the z-index for the layer.
⚠️ Warning: To be able to take advantage of the CSS Class option you'll need a developer's knowledge.
Keep in mind that we're unable to provide help with custom coding, or the possible issues that are happening because of them.
You can give a custom CSS class to the layer. The field accepts any valid CSS class name (without the
You can use this CSS class to write your own codes and target this specific layer with it. For example, if you write "example" (without quotemarks) into that field, in a HTML code the result would look like:
<div>Inner html code depends on layer</div>
and you can write CSS codes like this:
to override the styling.