There are many ways to add Lottie animated icons to your WordPress projects. You can either use Lordicon WP Plugin or proceed with built-in Lottie options for common WordPress themes.
Adding animated icons to WordPress
Lordicon WordPress Plugin
-
Easy Upload: Upload icons in JSON (Lottie) format from the Lordicon library or any other Lottie animation. Don't want to host icons in Media Library? Use the icon URL from the "Embed HTML."
-
Animation Triggers: Choose among "hover," "click," "forward and reverse," "forward, hold and reverse," "auto loop," or "still" animation player options.
-
Adjust Icon: Change each icon's size, color, or stroke size.
-
Shortcode: Happy with adjustments? Copy the easy-to-read shortcode and paste it anywhere from Divi, Elementor, or a custom theme.
We use Gutenberg editor as a platform to host Lordicon WordPress Plugin. It works the best with Lottie files as it gives immediate feedback after customizing icons or setting different animation triggers.
Build-in Animation Triggers
Video Tutorial
How to add Lottie animated icons to WordPress with Lordicon Plugin


YouTube videos require cookies, you must accept their cookies to view.

WordPress Lottie integrations
Video Tutorials
Divi
How to install LordIcon into Divi Wordpress by HeyPressGo


YouTube videos require cookies, you must accept their cookies to view.

Elementor
Animated Icons with Lordicon by Web Squadron


YouTube videos require cookies, you must accept their cookies to view.

Elementor
How to Add Animated Icons in WordPress using Elementor by Make Dream Website


YouTube videos require cookies, you must accept their cookies to view.
