---
title: "How to Use Lottie as a Hotspot Pin in Elementor?"
url: https://theplusaddons.com/docs/use-lottie-as-a-hotspot-pin-in-elementor/
date: 2024-05-13
modified: 2026-04-09
lang: en
author: "Aditya Sharma"
description: "Do you want to use a Lottie animation as a hotspot in Elementor? Using Lottie animation as a hotspot can make your hotspots more engaging. With the Hotspot widget from..."
image: https://theplusaddons.com/wp-content/uploads/2024/05/How-to-Use-a-Lottie-as-a-Hotspot-in-Elementor_-1024x536.jpg
word_count: 277
---

# How to Use Lottie as a Hotspot Pin in Elementor?

## 

- Utilizes the Hotspot widget from The Plus Addons for Elementor to integrate Lottie animations as hotspots.
- Requires a JSON file URL from LottieFiles.com to implement the Lottie animation in Elementor.
- Involves adding an image, selecting Lottie from the Pin Type dropdown, and pasting the JSON link in the Lottie URL field.

Do you want to use a Lottie animation as a hotspot in Elementor? Using Lottie animation as a hotspot can make your hotspots more engaging.

With the Hotspot widget from The Plus Addons for Elementor, you can easily use a Lottie as a hotspot in Elementor.

*To check the complete feature overview documentation of The Plus Addons for Elementor Hotspot widget, [click here.](https://theplusaddons.com/docs//add-an-elementor-hotspot-on-an-image/)*

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

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

First, go to[ LottieFiles.com](https://lottiefiles.com/) and create a free account there if you don’t have one.

Now log into your account and go to[ Featured](https://lottiefiles.com/featured) here you’ll find all the free Lottie files.

Click on the animation you like, it will open in a popup, click on the **Save to workspace to generate** button.

It will open the Lottie animation in a new window.

From the right panel enable the **Enable Asset Link** toggle. 

Then copy the Lottie file URL from the **Asset link** field. 

Then add the Hotspot widget from The Plus Addons for Elementor on the page and follow the steps -

1. Add the appropriate image in the **Hotspot Image** section.

2. Then open the repeater item on which you want to use Lottie. Then select **Lottie** from the **Pin Type** dropdown.

![](https://theplusaddons.com/wp-content/uploads/2024/05/hotspot-pin-type-lottie.gif)

3. Then paste the copied JSON link in the **Lottie URL** field.

4. Then add the appropriate content for the tooltip from the **Pin Content** section.  

Now you will see the Lottie animation as a hotspot over the image.