LottieFiles, a company that hosts thousands of Lottie animations and helps designers create and test their animations, has just released an official plugin for WordPress. The company recently raised $37M in a Series B round, passed three million users on its website, and is investing in making motion design more accessible.
Lottie’s open source animation file format is used by more than 135,000 designers and developers in websites and apps for Amazon, Google, Spotify, Microsoft, TikTok, Netflix, BBC, Uber, and other high profile companies. The JSON-based format was created by the design team at Airbnb and grew in popularity because of the small file size (600% smaller compared to GIFs), the fact that it is scalable at run-time, and its flexibility to be used across any platform. Lottie files can be used on iOS, Android, web and React Native without modification.
LottieFiles’ new WordPress plugin is available for free on WordPress.org. Once the plugin is installed and activated, it will prompt you to sign into your LottieFiles account or a create a free account. You will also be given the option to share the account with other users and copy Lottie files to the WordPress Media Library.
The plugin was made for the block editor. Inserting the LottieFiles block will launch a modal window where users can browse recent, featured, and popular Lottie animations. Users can also search through LottieFiles’ library of more than 50,000 animations or access private files from their accounts.
One of the benefits of using the plugin, as opposed to simply embedding an animation, is that the block settings allow users to easily adjust the Lottie size and background, along with the speed, looping, and controls display.
Although block libraries like Kadence Blocks have support for Lottie animations, LottieFiles’ official plugin is a single-block plugin and includes more block controls. It offers one of the most user friendly ways to insert animations into web pages, blog posts, or any content that could use a little a little motion design.
The LottieFiles team has been responsive on the support forums and in the reviews so far. In one instance where a user reported that the plugin adds its CSS on every page in the front and backend, instead of conditionally adding it when Lotties are displayed, the plugin’s developers said they are working on minimizing the CSS added to pages. LottieFiles is accepting bug reports and feature requests on their feedback site.
Thank you so much for trying out our plugin and featuring it here 😄
We’re thrilled to hear you find the plugin helpful, and as you’ve highlighted, we’re working on some improvements.
We’d love to get more feedback and hear from the rest of the community.
By the way, I use optimised Lottie block on my site from Greenshift addon, it’s paid addon so I am waiting to have similar in free version of Lottie plugin. You can see speed on google https://pagespeed.web.dev/report?url=https%3A%2F%2Fblockpresswp.com%2F
So, it’s possible to make it optimised but all free Lottie plugins don’t do this and I am forced to use premium plugin.
You can use them without any plugin, this is the most optimised way I have found.
You can use without plugins only as iframe or as html with direct links on scripts. This is even worse for page speed and web vitals score. I don’t know how developers of Greenshift made this, but I see that it’s possible somehow. Maybe delayed loading or similar solution.
Hey there Rosyslav
Thank you for your feedback and trying out the plugin. We’ll look into making the block optimised.
We’ve also released a new version (v1.0.5) that removes unnecessary css from the frontend. The overall footprint of the plugin should be lower.
If you have any more issues, or feedback, please reach out to us from: https://feedback.lottiefiles.com/plugin-wordpress
Enter your email address to subscribe to this blog and receive notifications of new posts by email.
WordPress Tavern is a website about all things WordPress. We cover news and events, write plugin and theme reviews, and talk about key issues within the WordPress ecosystem…
© All Rights Reserved. Powered by WordPress, hosted by Pressable