Add Section Image Slideshow Background

You are here:
Estimated reading time: 1 min

Creating the slideshow

To make a section’s background an image slideshow, access the Section’s options > Style Tab > Background settings and click on the Slideshow icon eg: https://d.pr/i/MbrcGo .

Doing this will enable the Background slideshow options section eg: https://d.pr/i/MbrcGo .

Add as many images you want (but not too many because it will surely slow down the page).

You can enable autoplay and control the transitions effect and speed.

Connecting with Toggle Boxes element

You can add navigation by adding a Toggle Boxes widget in this section. Simply adding the element anywhere in this section, it will connect with the parent section, but it’s important you manually create the Toggle boxes items eg: https://d.pr/i/XE1s2G . So if the slideshow has 3 images, make sure Toggle Boxes has 3 items as well.

In Valencia demo, Toggle Boxes element is used with Staks skin, which displays outlined boxes with text inside, triggering the slideshow by hovering over them:

Screen Capture on 2019-08-22 at 17-35-10.gif
Valencia Demo

Modifying existing slideshow

Likely you have installed Valencia Demo. In this case, edit the homepage with Elementor and click on the first top section and access the Background settings where you can find the Background slideshow settings.

Here’s a quick video how to do it https://d.pr/v/gPMije .

Was this article helpful?
Dislike 0
Views: 491

Join the conversation