A Lottie is a type of animation that you can add to the pages of your site. Lotties are lightweight files that allow you to scale your animation without pixelation, allowing you to add smooth looking animations to your site.
Getting Started
There is online library where you can find and download free to use Lottie animations that you can add directly to your Showit site. You can find this online resource at this link here:
Create a Free LottieFile Account
To download a Lottie from this library you will need to create a LottieFile account. There are some additional options that you can access with a paid account, but you are not required to have a paid account to download and use the available free Lotties in this library.
Find and Download Lotties
Once your account has been created and you're logged in, you can search the LottieFiles free library for the perfect Lottie animation.
Once you've found one you'd like to use, click on it to view it, then choose the option in the top right of the window that says Download. You must then select a destination for your file to be downloaded.
Note: With LottieFile's free Starter Plan you will only be able to save 10 Lottie animations each month.
Once that is done, you'll be taken to an editor where you can download your file. In the right side panel you'll see an option called dotLottie. Hover over this option, then click to Download.
(Optional) Alternatively, you can get an asset link instead of downloading the file. To do this, click the option at the top of the right side panel that says </> Handoff. Then simply toggle the Enable asset CDN option, and copy the link under Asset Link.
Adding a Lottie to Your Page
Once you have either downloaded your Lottie file or copied your asset link, jump back into your Showit design.
Option 1: Drag & Drop
If you downloaded the file, you can drag and drop the Lottie directly onto your page.
Option 2: Media Library
You can also click the Add Element option in the bottom toolbar, then choose Lottie from the menu. This will add a Lottie placeholder to your canvas.
Once you have a placeholder, you can click in the right side panel to Choose Lottie file. This will open up your Media Library, where you can add any Lottie file that you have uploaded there.
Option 3: Asset Link
Finally, if you chose to copy the Asset Link, you can add a Lottie placeholder as shown above, then change the Source of your Lottie to an Asset Link from the drop down. Then you can paste that link there, and you should see your Lottie appear in the placeholder's spot.
Customization Options
There are a handful of customization options that you can use to make your Lotties look and feel even more unique.
Loop
The Loop setting will allow you to choose whether or not you would like your Lottie to continuously play. If this is toggled off, your Lottie animation will play once, then stop.
Mode
The different Modes allow you to choose which direction you would like the animation to play. You can choose between Forward, Reverse, Bounce, and Bounce Reverse.
Speed
Speed indicates how fast the animation will play. At 1x the animation will play normally.
Additional Customization
You can also add additional customization options to your Lottie animations by clicking the + Customize option. Here you can adjust the Opacity, Blur, Drop Shadow, Border Radius, and even add a background color to your Lottie.











