The below steps guide you through integrating a Lottie animation into your content.
1. Admin > Customize > Content. Click to edit your app.
2. In the app customization, expand the group, Media under Content. Click on the 'Lottie Animation.'
image.png491.18 KB
3. The Lottie animation setup screen comes up.
image.png342.21 KB
Lottie Type: Provide a URL link for the Lottie file or upload your own Lottie .JSON file:
1. Link: When selected, you are able to copy/paste the Lottie animation URL in the text field.
2. JSON file: When selected, you're able to browse your computer to upload a Lottie .JSON file.
image.png361.8 KB
When Lottie Type is Link: Provide a URL link to a Lottie animation:
image.png347.93 KB
You can get registered at https://lottiefiles.com and either download or get an animation URL. Note: External source is subject to change.
When Lottie Type is JSON: Upload a Lottie file from your own:
image.png368.32 KB
4. At this point, click on the 'Create' and complete adding Lottie animation to your content with default animation settings. Or, move on to the next step to set up your animation behavior.
5. Set up animation behavior as described under 'Additional tasks.'
6. 'Put online' to publish your Lottie animation so that it will appear on your users' devices. The button's caption changes from 'Put online' to 'Published' once the changes have been applied successfully.
Additional tasks:
You can do more with Lottie animation by click on the 'More options' button when creating or editing a Lottie animation. More options > Settings:
image.png475.87 KB
Play mode: Normal & Bounce are choices
Animation speed: Set your preferred animation speed
Controls: Enable/disable the display of play controls
Autoplay: Enable/disable autoplay of the animation when app loads
Background color: Set a background color
Loop: Enable/disable animation play looping
When all set, click on the 'Create' or 'Save' to complete.
