Elementor Page Background – Image, Video, Kenburns Animation

The default Elementor plugin allows you to create multiple types of Elementor Page Background. For example elementor video background, elementor parallax background with image or video.

As bonus tips, I will share how to arrange animated Gradient, Background Slider, & particles in the elementor section background. Check this to add moving background image in Elementor section.

First, let me show you how to arrange a full page background from page settings.

Click on the settings icon on the bottom left of your page editor.

Now navigate to the Style tab. Select background type classic or gradient. From classic option you able to select any image as elementor page background.

Elementor Page Background

This is how general elementor page background works.

It’s time to explain how to arrange video, image, parallax, animated gradient background in your elementor section.

Just add a section on your page. Then navigate to style area. You will see the background option. In default Elementor, there are 4 different background types Classic, Gradient, Video, Slideshow.

Classic Background

From classic background type you able to select color or image. Select gradient type and input your desired colors, color location, Angle, and gradient type (Linear or Radial).

Classic Elementor Section Background

video Background for section

You can use YouTube, Vimeo, self-hosted MP4 Video Link. Then you can define video start time and end time. Enable Play Once if you want to play the video only once. Also, enable Play On Mobile if you prefer to play your section background video in mobile devices.

Elementor Video background

Elementor background slider

Select slideshow and upload or select multiple images from your media. Five transition effect, set Transition Duration, select background size, and position.

Elementor Section Background Slider

That’s all about default elementor section background settings.

Let’s see how to set Elementor Kenburns effect in section background. After that, I will show you how to arrange particles and animated gradient background in elementor section.

If you haven’t installed Master Addons plugin in your WordPress Website, then do it to work with the following feature. Check how to create an interactive background with this free plugin.

Kenburns animation Background Slider

After installing Master Addons plugin you will see Background Slider option in the section style tab. Upload multiple images, select image size, transition, Animation, Overlay style, and image slide delay. You will get 25 different types of transitions and 10 different kenburns animation effects. 

Elementor Kenburns Background slider

Elementor Particles Background

Just enable particles and you will see a “Click Here” link to generate JSON code for the below field. Go to the link and generate your desired particles. Download the JSON file and copy code from the file to paste. Check how to add particle background in Elementor post for more details. Just make sure to set background color, gradient before enables particles. 

Elementor Particles Background

Elementor Animated Gradient Background

As a master addon user you will see “Animated Gradient Background” option in the section style tab. Just enable it and you will see the default animated gradient BG. Change the angle value and add as much color you need for your section gradient. Here is a real example of Elementor animated gradient BG. 

That’s it. Now install and active Master Addons plugin in your WordPress Website. Then arrange any type of elementor page background or Section background. Feel free to get in touch with our expert team if you face any problem. 

Master Addons Demos

Heading

Animated Headlines
Dual Heading
Gradient Headline

Image

Image Hover Effects
Image Hotspot
Filterable Image Gallery
Image Comparison
Gallery Slider
Advanced Image

Content

Advanced Accordion
Tabs
Toggle Content
Team Member
Team Slider
Infobox
Flipbox
Blog
Timeline
Business Hours
Pricing Table
Restrict Content
Dynamic Table

Special Elements

Call to Action
Tooltip
Progress Bar
Progress Bars
Creative Button
Creative Links
News Ticker
Table of Contents
Current Time
Domain Search
Nav Menu
Search
Blockquote
Counter Up
Countdown Timer

Extensions

Particles
Animated Gradient BG
Reading Progress Bar
Background Slider
Custom CSS
Custom JS
Positioning
Container Extras
Mega Menu
Entrance Animation
Transforms
Rellax
Reveal
Header,Footer,Comment
Display Conditions
Dynamic Tags
Floating Effects
Custom Breakpoints
Post/Page Duplicator
Wrapper Link

Contact Form

Contact Form 7
Ninja Form
WP Forms
Gravity Forms
Caldera Forms
weForms