There are many ways to add a Lottie Animation to your website using Elementor Page Builder & Premium Addons for Elementor. We will go through each method and will describe what is the best usage cases for each method.
Adding a Lottie Animation as a Foreground Object
The simplest way to add a Lottie animation as a foreground object is to use: Lottie Animations Elementor Widget. It’s a free widget included in Premium Addons for Elementor.
If you need a more advanced widget, Image Layers Elementor Widget will be perfect for you. Using this widget will allow you to add a single Lottie Animation, multiple Lottie animations in layers, or even combine Lottie animation layers with other images and text layers.
Using Lottie Animations as Background Objects
If you want to use Lottie Animations as backgrounds inside your Elementor web page, You can use Lottie Animation Section Addon. It allows you to add a single Lottie Animation or multi-layers Lottie Animations to any Elementor section as a background. You can even combine it with other backgrounds and section addons.
Using Lottie Animation Instead of a Regular Image Inside a Specific Widget
You can use Lottie Animations instead of regular images in all Premium Addons for Elementor widgets below:
