Unlocking a touch of cinematic magic on your WordPress website becomes a breeze with the Ken Burns Addon for Elementor Page Builder. This versatile Elementor tool offers a range of options and features for smooth transitions, allowing you to enhance your web page’s background images effortlessly.
When you use the Elementor Ken Burns Addon, your background images will come alive with impressive effects and animations without much hassle.
In this tutorial, we’ll show you how to incorporate the Ken Burns effect into your Elementor section or container.
Experience the magic of our Premium Ken Burns Section Addon in action today!
Requirements:
- You will need Premium Addons PRO plugin installed and activated on your website.
- Also, make sure that this widget/addon is enabled so you can find it in the Elementor editor. Check this article to know how to do that.
- Premium Addons works only with Elementor Page Builder plugin so you will need to have it installed and activated as well.
Key Features
Settings
- Activate Ken Burns Effect: Use the switch to enable or disable the Ken Burns effect within your Elementor section/container.
- Add Image: Initiate the process of incorporating images as background elements in your Elementor section/container.
- Scale Speed (seconds): Adjust the speed of the Ken Burns Effect scaling in seconds.
- Transition Style: Determine the appearance of the transition between background images by selecting from options such as Fade, Horizontal Scroll, and Vertical Scroll.
- Effect: Select the effect of images for Elementor Ken Burns Effect.
- Effect Speed: Define the speed of the Ken Burns effect on your Elementor section/container background.
- Infinite: This option enables you to create an endless Ken Burns Effect, suitable for single background image scenarios.
- Overlay Color: Customize the overlay color applied to the background images within the Ken Burns effect.
Items
- Add Item: Select or upload the background images.
- Upload Image: Select the image to be used on Elementor Ken Burns Effect.
- Image Fit
- Fill: The image is sized to fill Elementor’s container/section. If necessary, the background image will be stretched to fit.
- Contain: The image is scaled to maintain its aspect ratio while fitting within the Elementor container/section.
- Cover: The image is sized to maintain its aspect ratio while filling Elementor’s container/section entire content box.
- Direction
- Center Center
- Center Left
- Center Right
- Top Center
- Bottom Center
- Top Left
- Top Right
- Bottom Left
- Bottom Right
- Zoom Direction
- Zoom Direction “In” makes the image seem to be bigger and closer than it actually is.
- Zoom Direction “Out” makes the image seem to be smaller and farther away than it actually is.
Conclusion
In summary, Elementor Ken Burns Addon offers a simple and effective way to incorporate the captivating Ken Burns effect into your web page’s background images. With easy-to-use settings for transition, scale speed, and overlay colors, you can create visually stunning Elementor sections and containers that grab your visitors’ attention. Elevate your design possibilities and make a lasting impression with this powerful Elementor feature.
