How to Add Lottiefiles to an Elementor Pricing Table Button?

Updated onApril 9, 2026By

Key Takeaways

  • The Plus Addons for Elementor allows users to add animated Lottiefiles to the Pricing Table button.
  • Users must copy the Lottie file URL from LottieFiles.com and paste it in the Lottie URL field of the Pricing Table widget.
  • The Pricing Table widget requires installation and activation of The Plus Addons for Elementor to function.
Table Of Content

Do you want to add a Lottiefiles to an Elementor Pricing Table Button? With the Pricing Table widget from The Plus Addons for Elementor, you can add animated Lottiefiles to the pricing table button.

To check the complete feature overview documentation of The Plus Addons for Elementor Pricing Table widget, click here.

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.

LIVE WIDGET LINK

For this, you need to have the JSON file URL of the LottieFile you want to use.

First, go to LottieFiles.com and create a free account there if you don’t have one.

Now log into your account and go to the free Lottie animation section here you’ll find all the free Lottie files.

Click on the animation you like, it will open in a popup, and save the file in your workspace.

It will open the Lottie animation in a new window.

From the right panel go to the Handoff tab and enable the Enable asset CDN toggle.

Then select Lottie JSON from the Asset link format dropdown. 

After that, copy the Lottie file URL from the Asset link field. 

Then, add the Pricing Table widget to the page and follow the steps –

1. Add the appropriate title, price and content of the pricing table.

2. Then enable the Button toggle from the Button tab.

3. Select Style 2 from the Button Style dropdown. 

4. After that select Lottie from the Icon Type dropdown.

5. After that paste the copied JSON link in the Lottie URL field. 

Then from the Icon Position dropdown, you can place the Lottie before or after the button text.

You can further adjust the Lottiefiles size and animation from the style tab.

Now you’ll see animated Lottiefiles in the pricing table button.

Pricing table lottie demo how to add lottiefiles to an elementor pricing table button? From the plus addons for elementor

Read Further: How to Add a Tooltip to an Elementor Pricing Table?

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
LinkedIn X GitHub YouTube Website
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What if the Lottie animation doesn't show up in the pricing table button?

If the Lottie animation isn't displaying, ensure that you have copied the correct JSON file URL from LottieFiles. After enabling the asset CDN and selecting Lottie JSON, paste the URL in the Lottie URL field within the Pricing Table widget. A common mistake is neglecting to enable the asset CDN toggle, which is crucial for the animation to function properly.

Can I use The Plus Addons for Elementor to add Lottiefiles to other widgets?

The Plus Addons for Elementor specifically allows the addition of Lottiefiles to the Pricing Table button. While other widgets may offer different features, this functionality is unique to the Pricing Table widget. For a complete overview of its features, refer to the complete feature overview documentation.

What settings work best for adding Lottiefiles to a pricing table button?

For optimal results when adding Lottiefiles, use Style 2 from the Button Style dropdown and select Lottie from the Icon Type dropdown. This combination ensures that the Lottie animation integrates seamlessly with the button text. Additionally, adjust the Lottiefiles size and animation from the style tab to achieve the desired visual effect.

Is there a specific format required for the Lottie JSON URL?

Yes, the Lottie JSON URL must be obtained from LottieFiles after enabling the asset CDN and selecting Lottie JSON from the Asset link format dropdown. This ensures that the URL is correctly formatted for use with The Plus Addons for Elementor, allowing the animation to function without issues.

What happens if I forget to enable the asset CDN toggle on LottieFiles?

If you forget to enable the asset CDN toggle, the Lottie animation will not load in the pricing table button. This setting is essential as it allows the animation assets to be served correctly. Always double-check this step to ensure your animations appear as intended.

How do I find free Lottie animations to use in my pricing table?

To find free Lottie animations, create a free account on LottieFiles.com and navigate to the free Lottie animation section. Here, you can browse and select animations that suit your needs. After saving your chosen animation to your workspace, remember to copy the JSON file URL for integration into The Plus Addons for Elementor Pricing Table.

Last reviewed: April 9, 2026

Related Docs