Slide Background image vs Content layer background

Slide background images should be set at the Slide settings → Background tab → Image. Setting the background image on the Content layer can cause conflicts and prevent you from benefiting many useful features.

The Content layer background only shows up on the site and in the preview when there are layers inside the content element!

If you would like to display a background image for your slide, you should use the slide background feature instead of the Content layer.

Possible problems

  • 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

  • Background image optimization: The optimize feature works on slide background images only. Content layer backgrounds won't be affected and your site needs to load both the slide background and the content layer's background, slowing down the page loading.
  • 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.