We have a webpage here: Optimized Frozen Food Production Operations | IcePoint® that has 3 lottie animations in the “How It Works” section just about half way down the page. They were working but now they are broken.

I have gone through and checked the files and they are present where they should be. This is a customized WordPress website that I inherited from another designer so I will go through the steps I have found that they setup.

In the section of this page is this code: <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>

On the page mentioned above we have this code for each slide in the How It Works section:

<lottie-player src="<?php echo get_stylesheet_directory_uri(); ?>/animations/<?php the_sub_field('lottie_animation');?>" background="transparent" speed="1" style="width: 100%; height: 100%;" loop autoplay controls></lottie-player>

This gives us the urls to the 3 lottie player json files needed:

FPS: fps.json MVR: data02c.json Energy Balance: energy_balance.json

If I right click on the page and click View Page Source, I can see that the lottie script looks to be installed correctly.

When I go to the links from View Page Source for the json files I can see that these is json code within these files. If I add the files to the lottiefiles preview site they work.

When I go to the page mentioned at the top the animations do not appear. If I refresh the page they flash for a second or the controls bar flashes for a second and disappears.

We do have other places on the site that have Lottie files that work but they are setup slightly different.

Can anyone tell me what is blocking the animations from appearing?