Description

Browse from 221 animated SVG icons and 50 Lottie animations in Elementor Page Builder for your next project.

Try live demo or visit our website to view icon library and features.

Elementor, Web Design This guide to Lottie Animations will show you a creative way to use the Lottie widget as a button and set it to play an animation and download a free eBook upon clicking it. You may have noticed lately that UI animations are gaining a lot of popularity in the web design domain. Elementor Lottie Animations widget is a free widget give you the ability to easily add Lottie Animations to your Elementor pages with no need to add custom code. Generally speaking, Lottie is an open-source animation tool that allows you to use lightweight free or premium animation files on your site (as well as design and use yours). It’s used for different kinds of animation, in user interfaces, apps, line art, logos, and on regular websites. For preexisting lotties, lottiefiles.com is the best place to find the perfect asset. In this example, we found the perfect file: To add it to our site, simply scroll down, copy the URL and add it to the lottiefile element on your Elementor page. For a production site, getting a custom made lottie is always the best option.

SVG animation features:

• 3 types of animations
• Customizable stroke colors
• Scaling of icons to any size, padding adjustment
• Custom setting of animation duration time
• Option to upload and animate your own SVG icon
• On hover draw interaction option
• Entrance animation effects (36)
• Add link to icon (column)

Lottie animation features: Download boot camp support software for windows 10.

• 5 types of play settings: auto play, on hover, on click, on scroll, on mouse out
• Custom animation timing
• Scroll based display option
• Adjustable animation speed
• Alignment and margin settings
• CSS filter settings with transition duration on hover
• Opacity settings options – also on hover
• Hover animation effects (27)
• Border styling options
• Upload your own or enter Lottie animation URL
• One click customization

Installation

From within WordPress’ dashboard:

1. Go to Plugins -> Add New
2. Search for “Animated SVG”
3. Click “Install”
4. Click “Activate”
5. Open Elementor > Start using widgets

Manually via FTP:

1. Upload the folder ‘animated-svg/’ into the ‘/wp-content/plugins/’ directory
2. Activate the plugin through the Plugins tab in WordPress
3. Navigate to Elementor > Start using widgets

FAQ

I can’t upload my own images, what should I do?
– In rare cases hosting providers restrict the upload of SVG files. You should install an SVG support plugin like Easy SVG support https://wordpress.org/plugins/easy-svg/ to solve the issue.

Do I need Elementor Pro to use the widgets?
– No, the plugin works fine with the free version of Elementor. Minimum version required: 2.9.14

Can I use the icons without limitations?
– Yes, you may display the icons on your website. The source code of each SVG file contains the list of credits and/or the license copyright information. Docker image download offline. See license.txt for more information.

Reviews

Description

An unofficial WordPress plugin to add a Lottie widget to the Elementor Page Builder.

Features

• Intuitive UI, everything is configurable directly within Elementor, through the widget’s controls
• Manage and re-use animation data JSON files through the WordPress Media Library
• Works with the latest version of Elementor (does not require Elementor Pro)
• Includes several animation options, allowing you to customize:
  • The speed of the animation
  • Whether to autoplay on page load
  • Whether to loop or play once
  • Whether to play reversed
  • Whether to play on mouse over
  • Whether to stop, pause, or reverse on mouse out
• Includes several styling options, allowing you to customize:
  • The dimensions (width and max width) with responsive controls
  • Opacity, CSS filters, borders, and box shadow!

Setup tutorial

Installation

Automatic installation

Automatic installation is the easiest option — WordPress will handle the file transfer, and you won’t need to leave your web browser.

1. Log in to your WordPress dashboard
2. Navigate to the “Plugins” menu
3. Search for “Animentor – Lottie & Bodymovin widget for Elementor”
4. Click “Install Now” and WordPress will take it from there
5. Activate the plugin through the “Plugins” menu in WordPress

Manual installation

1. Upload the entire animentor-lottie-bodymovin-elementor folder to the wp-content/plugins/ directory
2. Activate the plugin through the “Plugins” menu in WordPress

After activation

You will find the “Lottie” widget under the “General” widgets category of Elementor Page Builder.

Lottie Animations Elementor

FAQ

Ableton live 10 mac torrent. Lottie is a mobile library for Web, and iOS that parses Adobe After Effects animations exported as json with Bodymovin and renders them natively on mobile!

If you have spotted any bugs, or would like to request additional features from the plugin, please file an issue.

Wordpress Lottie

Reviews