Eric Binnion

Animated GIF Not Working in WordPress?

·

Eric Binnion

After recently trying to post an animated GIF in a WordPress post, I was disappointed after saving the post and seeing that the image wasn’t animating.

Figuring that I did something wrong, I checked that the animated GIF worked on my computer and re-uploaded the image, but the animated GIF still did not work.

The issue was that I was using a cropped version of the meme that I uploaded. I assume that in the process of resizing the meme that the frames in the animated GIF were also stripped. This made the animated GIF just a regular image. and it didn’t matter how many times I re-uploaded the animated GIF, as long as I used any other size than the original, the animated GIF would not work.

How Do You Fix It?

The simple fix is to be sure to include the full size of the image after you click the add media button in the editor. Below is screenshot with an example.

Full Size Image

Notice the red line at the bottom right of the editor. This is where you select the size — Be sure to choose “Full Size”. This ensures that WordPress uses the original image that you uploaded.

Questions, Comment, Corrections?

If you have any questions or feel I didn’t explain something well enough, please a comment below.

Comments

40 responses to “Animated GIF Not Working in WordPress?”

  1. cynthia hoekstra Avatar
    cynthia hoekstra

    I have the same problem. I’ve uploaded gifs as “featured image”. On the homepage, half of them animate, the other half does not. I don’t know why, or what I’ve done differently to cause this. However when you click on the “Featured image” you go to the post and the gif does animates there.

    I can’t find the options you are referring to in your post, it does not show the same options to me when I’m in my library. Are using a plugin?

    Reply
    1. Eric Binnion Avatar
      Eric Binnion

      Hi Cynthia,

      With featured images, I don’t think it’ll be as easy of a work around. The reason why is that your theme has set what size the image needs to be. So, while you set the featured image, your theme can decide what size thumbnail it needs for different parts of your theme. This would have been coded into the theme.

      You could perhaps create a child theme, and change any references of the_post_thumbnail() to the_post_thumbnail( 'full' ). Then, in CSS, make sure the featured image is the size you need. This is untested, but it’s what I would do if I needed animated gifs as featured images.

      Hopefully that helps. Best of luck!

      Reply
  2. Mittie Babette Roger Avatar
    Mittie Babette Roger

    Hi! In my case it renders in the preview of the post, but doesn’t appear in the post itself. It’s set to full size. Wondering what else it might be …

    Reply
  4. Mike Avatar
    Mike

    Thank you. Mine is working now after your input after pulling my hair out for a while. Only a few strands left!

    Reply
  5. Beryl Rider Avatar
    Beryl Rider

    Thanks so much, Eric. This totally saved my ass during a last-minute emergency with a client.

    Reply
  6. Juls Avatar
    Juls

    Thank you so much for this explanation! I had just migrated from one WordPress blog to another and all my gifs broke. Only after I read your post did I realize that changing the size of the image rendered it immobile. Problem fixed! Thanks again.

    Reply
  15. kj Avatar
    kj

    this article is posted 3 years ago and it helped me with my gif issues, thanks eric

    Reply
  16. Mark Avatar
    Mark

    After researching many web pages and sites, I’m unable to resolve an issue I’m having attempting to load an animated GIF to my WordPress web page. I’ve followed every obvious, and not-so-obvious recommendation I can find with no resolution. My inserted file displays off-kilter to the right side of the page when viewing the site in normal mode. Have confirmed the “full-size” option, tried f/l, f/r, centered, and none for alignments….etc. Anybody discover a fix for this?

    Reply
    1. Eric Binnion Avatar
      Eric Binnion

      Does it only happen with animated GIF images? If that’s the case, then off of the top of my head, I am not sure why the GIFs would be aligned improperly.

      But, if it’s all images, I would assumed that whatever theme you’re using isn’t providing styles for the generated classes. For example, there need to be styles for a img.alignleft, etc.

      You can find more about that here in the “WordPress Generated Classes” section here:

      https://codex.wordpress.org/CSS

      Reply
  17. Mark Avatar
    Mark

    Thanks for the response Eric. Until recently, we’ve used only images (static and within sliders). We’re using a template which doesn’t require any coding at our end—just populating column formats:
    http://summationdesign.com
    The GIF size is approx. 4M in size, which I had thought was within parameters. Can not get this to align within the placeholder like the rest of the site. Has anyone else experienced this anomaly?

    Reply
  19. Cheyenne Avatar
    Cheyenne

    Thanks so much Eric! This was driving me crazy, the resizing fixed it up right away. 🙂

    Reply
  21. John Harris Avatar
    John Harris

    Another solution is to post the animated gif on an external graphic hosting site like imgur, and link to it. When you upload, most of these sites generate the HTML code you need. You just copy the link and paste it into your WordPress code where you want the animation to appear. .

    I would prefer to bring the gif into WordPress, rather than depend on an external hosting site, but if this requires a change in size, it would not always be practical.

    Thank you for your insights. John

    Reply
  24. Dr M Avatar
    Dr M

    Sorry, none of the “fixes” is working for our “Athena”-themed WP site. I created I simple .gif using Photoshop. The .gif works flawlessly on my computer, whether opened in a photo viewer, a simple video player or even as part of a Powerpoint slide. However, when uploaded and used as one of the two slider images for the Athena-themed site, the .gif appears as a static image. .Gifs have been around far too many years for them to be buggy when used in WP. Seriously, this is something WP ought to have nailed down a long time ago. Is there no coherent solution?

    Thank you, for any help you can provide!

    Reply
  26. vinod Avatar
    vinod

    I WAS SUFFERED MUCH WITH THIS PROBLEM. NOW I GAVE FULL WIDTH . THEN IT OK.
    THANKS TOOOOOOOOOOOOO MUCH BRO.

    Reply
  28. Rich Avatar
    Rich

    So glad I found this post. I was just about to pull my hair out. I appreciate it.

    Reply
  29. Empress Avatar
    Empress

    This was the most simple tip and was the issue. I also was able to resize my gif manually(in the post not the media editor) with it still working correctly. Thanks again, Im starting to upload more gifs/previews for content I make and this just makes my site so much better.

    Reply

Leave a Reply to MarkCancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Discover more from Eric Binnion

Subscribe now to keep reading and get access to the full archive.

Continue reading

Discover more from Eric Binnion

Subscribe now to keep reading and get access to the full archive.

Continue reading