Content Layer

You can find the Content layer in the Slide Editor.

Content

General

Inner Align

The default aliment of the content inside the Content layer. Learn more about the Vertical align in the Alignment and Spacing video.

• 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.

Vertical align

The default vertical align of the content inside the Content layer. Learn more about the Vertical align in the Alignment and Spacing video.

• Top: Aligns the layers inside to the top.
• Middle: Aligns the layers inside to the middle.
• Bottom: Aligns the layers inside to the bottom.
• Space between: Aligns the first layer to the top and the last to the bottom, and leaves equal amount of space between them..
• Space around: Divides the space between the layers equally.

Here's a video that illustrates the difference:

Style

Background image

The background image of the Content layer. Learn the difference between the Slide background and Content layer background.

Content Background

Here you can set a background color for your Content layer. You use the color to create an overlay for the Background image.

The background color can be adjusted for Normal and Hover state.

• Background color: The background color of your slide.
• Gradient: You can create a gradient color with this option.
• Color end: The finishing color for the gradient.

Spacing

Padding

You can put padding around the Content layer to create a nice distance from the slide edges.

Position

Align

When your Content layer has a Max Width you can align it within the slide.

Size

Max Width

You can limit the width of the Content layer.

Responsive

Learn about the Pesponsive options at the Layer Style documentation.

Effect

Learn about the Effect options at the Layer Style documentation.

Advanced

Learn about the Advanced options at the Layer Style documentation.

Animations

Learn about the animations at the Animation documentation.

Frequently Asked Questions

What's the difference between the Content layer background and Slide background?

Layers (like the Content layer) can only cover the slide canvas area, while the slide background can cover the whole slide. So when you use the Limit Slide Width option to prevent the slider from getting too tall, the size of the slide canvas will be limited and the Content layer's background won't be able to cover the slide.

The Courses demo slider takes advantage of this behavior, as it uses the Content layer's background to display the main picture of the slide.

What happens if you use both images?

• Loading issues: Since your slide has two images set, it needs to load twice as many images as are actually displayed for the visitor
• The set background does not show up: The Content layer is only displayed on the frontend if it has a purpose, so if has at least one layer.
• The slide background images might be visible during slide changing. (Which is the correct behaivor for them.) Then when the slide loads the Content layer's background will cover them.
• The slide is not completely covered by the background. The slides can be covered completely by the Slide background image only under any responsive scenario. The layers, such as the Content layer can be limited by a maximum slide width setting, preventing it from completely covering the slide.

Features you won't be able to use if you are using the Content layer's background

• Lazy loading: The lazy loading feature affects slide background images only.
• Background animations: The background animations affect slide background images and colors only. The layers can only be moved via the Main animation and layer animations.
• Ken Burns effect: The Ken Burns effect only works on slide background images, so you can't use it on the Content layer's background
• Fill modes: The fill modes can be used on slide background images only.
• Shape dividers: Shape dividers are below the layers, so if you use the Content layer to set the background image, you won't be able to use these either
• SEO. The Content layer's background is a simple CSS background, so it doesn't support the alt text, what img tags do.