CMS Tips & Tricks
How to Add Lottie Files
Lottie files are really cool animated graphics that are design to be small in file size. Here is how to use them.
Build your custom knowledge base or resource center with HubDB quickly and effortlessly!
If you're looking to add a bit of pizazz to your website, utilizing Lottie Files can be a great choice. Especially for pages you're optimizing for UX. If you're optimizing for SEO/Performance, then you might want to pass on these little gems even if they are small in file size.
How to set this up...
First, you're going to want to create an account on the Lottie Files website. You can find free and paid lottie files. Once you find one you like, go into edit mode and click the handoff </> icon.
Then be sure to select Optimized Lottie JSON from the dropdown before copying the Asset Link to your clipboard.
Use the Magic Module to add a Lottie File
Next, drag a Magic Module into the page where you'd like to use the lottie file. Then click the Start Here section and be sure to turn on the Lottie feature.
Next, go into any of the columns and add a new Content Element and select Lottie Animation from the dropdown. You'll immediately see where you can paste the Asset Link you have copied to your clipboard.
If you are using Multiple Lottie Files on a single page, you must be sure to give each a unique ID.
That's it. You're done!
Now, let's be honest... You just did Jazz-hands didn't you??
... Jaaaaazz Hands!
