Skip to main content
All CollectionsWebsitesOther
How to use Lottie files
How to use Lottie files
Alexis Taylor avatar
Written by Alexis Taylor
Updated over 2 months ago

You can use Lottie files with Umso for efficient Animations. To do this, you will need to use a small amount of code since this is not currently possible through our UI.

Uploading your Lottie Data

Upload your lottie data.json file to one of your File Libraries. Then map the file to your website through the "File" settings in your site dashboard.

Rendering your Lottie Animation

To render your animation on your website, add a custom code section. In this custom code section, you need to load the lottie player, and configure your animation.

<div id="bm"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.9.1/lottie.min.js" type="text/javascript"></script>
<script>
var animation = bodymovin.loadAnimation({
container: document.getElementById('bm'),
renderer: 'svg',
loop: true,
autoplay: true,
path: '/data.json'
})
</script>

Viewing your Animation

Your animation may not display inside the editor preview. To view your animation, publish your site and visit your published site.

Did this answer your question?