Gif is loading as a static image

When we upload a gif image when trying to upload a blog post, it loses its animation. What are we missing?

Hey @yasintze, welcome to the community.
Can you share with us the original gif you uploaded to the Media Library and the URL of the one in your repo?

Here's the repo url

wrestle_training_with_dummies_compressed

Hey there. Sorry, I meant to ask you for the URL of the media file in your repository, but I believe the one you shared is it, right? I can't see the issue of it being static. If anything, it has a setting that only allows it to loop a few times, and then it stops. You need to modify these settings in the image configuration, outside of Prismic, before you upload the media again.

Hi Pau, in the previous message, I shared the URL of the media file in the repository, as well as the original image. Here is the URL of the media file from our repo again, this time i've edited the gif to loop an arbitrarily large number of times.

When I click on the above link, it takes us to the static image. This is the same static image we see when we publish the blog post via prismic.

Currently, our blog is hosted as static html with a single post here. You can see the original image here where its not facing any looping issues.

I've also tried to compress the file to make it < 4mb, while keeping the loop count arbitrarily large, here is the link of the compressed media file from our prismic repo again.

Hope this helps!

I can't see the issue on the URL you sent. Which browser are you using?

Aah interesting, I'm using firefox. I tried the url on chrome and safari and it seems to be working. Any ideas what the issue with firefox could be?

1 Like

The only issue we're aware of is that Firefox and Safari have limitations on rendering animated avifs.

I believe this goes away if you remove the param in the url (auto=compress,format)

1 Like

Got it, thanks. Follow-up question - the param (auto=compress,format) is added by default when we upload the image and add it to a blog post. How can we get rid of it?

Hello
You'll need to modify the url string in the front end of your project.