# DotLottie in Elementor

**URL:** <https://forum.lottiefiles.com/t/dotlottie-in-elementor/2300>\
**Category:** Lottie in Web\
**Created:** [February 19, 2022, 4:02pm UTC](https://forum.lottiefiles.com/t/dotlottie-in-elementor/2300 "2022-02-19T16:02:42Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![capstone8521](https://yyz2.discourse-cdn.com/flex030/user_avatar/forum.lottiefiles.com/capstone8521/32/1355_2.png) [@capstone8521](https://forum.lottiefiles.com/u/capstone8521)\
**Post date:** [February 19, 2022, 4:02pm UTC](https://forum.lottiefiles.com/t/dotlottie-in-elementor/2300/1 "2022-02-19T16:02:42Z")

</div>

I wanted to know is there any way I can use Dotlottie (.lottie) in Elementor wordpress website? I am using Elementor Pro and able to use json in it but want use Dotlottie to decrease the size of my file

---

<div class="post-metadata">

**Author:** ![haleeza](https://yyz2.discourse-cdn.com/flex030/user_avatar/forum.lottiefiles.com/haleeza/32/4969_2.png) [@haleeza](https://forum.lottiefiles.com/u/haleeza)\
**Post date:** [March 8, 2022, 12:26am UTC](https://forum.lottiefiles.com/t/dotlottie-in-elementor/2300/2 "2022-03-08T00:26:56Z")

</div>

Hi @capstone8521

I’ve checked this with our engineer and here’s his answer:

I couldn’t find how to do it with Elementor so I reverted to the original Wordpress editor (which that person can do too normally), these are the steps to take to use dotLottie:

1. Add custom code, for this part, I installed this plugin to make it easier: [Simple Custom CSS and JS – WordPress plugin | WordPress.org English (UK)](https://en-gb.wordpress.org/plugins/custom-css-js/)

2. I added the dotLottie CDN to the header of my page using the plugin:

3. In the block editor I used the dotLottie-player as indicated via the dotLottie docs using a custom html block:

```auto

<figure class="wp-block-image size-full">
<dotlottie-player
  autoplay
  controls
  loop
  mode="normal"
  src="https://assets2.lottiefiles.com/dotlotties/dlf10_l12sw9oo.lottie"
  style="width: 320px"
>
</dotlottie-player></figure>

```

 ![image](https://canada1.discourse-cdn.com/flex030/uploads/lottiefiles/original/2X/a/a2d38089274e3a184383580a5c58547936a9352e.png)  
 ![Screenshot 2022-03-07 at 14.24.32](https://canada1.discourse-cdn.com/flex030/uploads/lottiefiles/original/2X/1/1f1565189deae63d4ca176e64db17f92e3570b62.png)