How can we help you today?

How to Add Lottie Animations in the ShortPoint Code Design Element

This article will walk you through on how to add a Lottie Animation to your SharePoint Page using the Code Design Element.



Interactive Tutorial

Go through the interactive tutorial to learn how to insert Lottie Animations using the Code Design Element:

NOTE: You can choose any Lottie Animation from to add to your SharePoint page.

Step-by-step Tutorial

Here are the detailed steps on how to add Lottie Animation using the Code Design Element:

Step 1: Insert the Code Design Element

  • Click the black plus icon to insert the Code Design Element.
  • Then, use the search field to look for the Code Design Element.
  • Click Code to open the Code Settings window.

Step 2: Copy the Lottie Animation Code

  • Go to and choose the Lottie Animation you prefer.
  • Customize your Lottie Animation according to your preference.
  • Scroll down and click Copy Code.

Step 3: Paste Code in the Code Design Element

  • Go back to your SharePoint Page.
  • Paste the copied code in the HTML field.

Step 4: Insert and Save

  • Once you are satisfied, click the green checkmark.
  • Then, click Save to keep your progress.

Congratulations! You have successfully added a Lottie Animation to your page. Enjoy adding these creative animations to your page.

Related articles:

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 52 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more