--- title: Background Slider Extension Settings description: "One hero image says one thing. A hero background that rotates through your best three or four photos says considerably more, without adding a single widget to the layout. The [Background Slider extension](https://master-addons.com/extension/background-slider/) in [Master Addons for Elementor](https://master-addons.com/widgets-and-extensions/) replaces a…" url: "https://master-addons.com/docs/extensions/background-slider-extension/" updated: "2026-09-16" category: Extensions --- # Background Slider Extension Settings One hero image says one thing. A hero background that rotates through your best three or four photos says considerably more, without adding a single widget to the layout. The [Background Slider extension](https://master-addons.com/extension/background-slider/) in [Master Addons for Elementor](https://master-addons.com/widgets-and-extensions/) replaces a section’s static background with an image slideshow: pick the photos, pick a transition, and the content sits on top while the backdrop cycles behind it. Here is the finished hero from the demo, cycling through its three photos with a swirl transition: ![Background Slider extension cycling three photos behind a hero heading and buttons with a swirl transition in Elementor](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/07/02083412/06-background-slider-demo.gif) ## What the Background Slider extension does Once enabled, containers, sections and columns get a **Background Slider** panel in their **Style** tab, next to the regular Background section. Flip it on, add images from the media library, and the section background becomes a timed slideshow. Everything about it is configurable: - **Add Images:** a gallery field holding the slides, reorder or remove them in the standard WordPress gallery editor. - **Transition:** 24 effects between slides plus Random: Fade, Slide in four directions, Zoom In and Out, Swirl, Burn, Blur, and Flash, each with a second variant. - **Animation:** Ken Burns motion on each slide, in nine directions, Random, or None. - **Custom Overlay:** a color, gradient, or image layer over the slides, plus nine preset overlay styles that keep text readable. - **Delay and Timer:** how long each slide holds (5000ms by default), and whether a thin progress bar shows the time left on each slide. - **Random Display, Image Resolution, Cover:** shuffle the order when the page is generated, choose the loaded size, and control how images fill the section. ## Before you start - **WordPress** with **Elementor** installed and active. - **Master Addons for Elementor** installed and active. New to the plugin? Follow the [installation guide](https://master-addons.com/docs/getting-started/installing-plugin/) first. - Background Slider is a free extension, so no Pro license is required. - Two or more images sized for full-width display, ideally similar dimensions. ## How to enable the Background Slider extension From your WordPress dashboard, go to **Master Addons** and open the **Extensions** tab. Background Slider sits in the **Animation Widgets** group, next to [Animated Gradient BG](https://master-addons.com/extension/animated-gradient-bg/) (Pro). Click its toggle so it turns purple, then hit **Save Changes** and wait for the green "Settings saved successfully" notice. ![Background Slider extension toggle in the Animation Widgets section of the Master Addons Extensions tab](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/07/02083341/01-enable-background-slider.webp) ## Open the panel and add the images Select the hero container in the Elementor editor and open the **Style** tab. Expand the **Background Slider** section with the purple MA badge and switch **Enable Background Slider** to Yes. The full settings list appears, with an **Apply** button at the top for pushing changes to the preview. ![Background Slider settings in the Elementor Style tab with three images selected, transition, animation, and overlay controls](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/07/02083347/02-background-slider-settings.webp) Click **Add Images** and pick the slides from the media library. The demo uses three service photos. The gallery editor handles the order: drag to rearrange, hit the X to drop one, or Add to gallery for more. ![WordPress gallery editor reordering the slides for the Background Slider extension](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/07/02083353/03-slider-image-gallery.webp) ## Pick the transition and motion The **Transition** dropdown decides how one slide hands off to the next. The list runs long: Fade, Slide Left, Right, Up, and Down, Zoom In and Out, Swirl Left and Right, Burn, Blur, and Flash, each in two variants. The demo lands on **Swirl Left**. ![Transition dropdown of the Background Slider extension listing Fade, Slide, Zoom, Swirl, Burn, Blur, and Flash effects](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/07/02083359/04-transition-effects-list.webp) The **Animation** setting adds Ken Burns movement inside each slide, a slow pan and zoom that keeps the background alive between transitions. Pick a direction or set it to **Random** and let each slide drift its own way. ## Overlay, delay, and timer White text on a busy photo needs help. Turn **Custom Overlay** to Show and lay a color, gradient, or image over the slides, or pick one of the nine preset **Overlay** styles with patterns built for readability. Below that, **Delay** sets how many milliseconds each slide holds (5000 in the demo), **Timer** shows a progress bar for each slide (the slides rotate either way), and **Cover** makes the images fill the section edge to edge. ![Custom overlay, background type, cover, delay, and timer settings of the Background Slider extension](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/07/02083404/05-overlay-timing-settings.webp) ## The result on the page Publish and the hero cycles on its own, exactly as in the GIF at the top of this page: each photo holds for the delay, swirls into the next, and the heading and buttons stay fixed on top. Visitors get a moving backdrop without a separate slider widget, and the section structure underneath never changes. ## Where a background slider works well - **Hero sections.** Rotate three strong photos instead of betting the first impression on one. - **Service businesses.** Show the team at work behind one headline. - **Restaurants and venues.** Dishes and interiors cycling behind the reservation button. - **Portfolios.** Recent projects as the backdrop of the intro section. - **Landing pages.** Product angles rotating behind a fixed call to action. ## Video Tutorial Watch the slider built end to end, from enabling the extension to the cycling hero on the published page. [How To Add Background Slider In Elementor Page Editor?](https://www.youtube.com/embed/Z6ujz7Hunjg?feature=oembed) ## Frequently Asked Questions How do I add a background slideshow to an Elementor section? Enable the Background Slider extension in the Master Addons Extensions tab, select the section, and open Background Slider in the Style tab. Turn it on, add two or more images, choose a transition, and the section background cycles automatically. What transition effects are included? Twenty-four plus Random: Fade, Slide Left, Right, Up, and Down, Zoom In and Out, Swirl Left and Right, Burn, Blur, and Flash, each with a second variant. A separate Animation setting adds Ken Burns pan-and-zoom motion inside each slide. Can I keep the text readable over the photos? Yes. Turn on Custom Overlay for a color, gradient, or image layer above the slides, or pick one of the nine preset overlay styles. The demo uses a dark overlay so the white heading and buttons hold contrast on every slide. How do I control the slide speed? The Delay field sets how many milliseconds each slide stays visible, 5000 by default. Timer only shows a progress bar, because the slides rotate on their own either way. Random Display shuffles the slide order each time the page is generated, so on a cached page the order changes only when the cache clears. Is the Background Slider extension free? Yes. Background Slider ships with the free version of Master Addons for Elementor, in the Animation Widgets group of the Extensions tab. The pricing page covers what the Pro plans add. Does Elementor have its own background slideshow? Yes. Free Elementor has a Slideshow background type with five transitions, a Ken Burns zoom in or out, lazyload and per-device positioning. Background Slider adds 24 transitions, Ken Burns in nine directions, pattern overlays, random order and a timer bar. The product page has a full comparison table. ## Wrapping up The [Background Slider extension](https://master-addons.com/extension/background-slider/) turns a section background into a slideshow with one toggle and a handful of choices: images, transition, overlay, delay. The content stays put, the backdrop does the work, and no extra slider widget enters the layout. For motion without photos, the [Animated Gradient Background extension](https://master-addons.com/extension/animated-gradient-bg/) (Pro) covers the same section with color instead, and the full set of [Master Addons widgets and extensions](https://master-addons.com/widgets-and-extensions/) is one page away.