How to Add Your Own GIFs in Gutenberg

Earlier this week, I was writing a post with the new Gutenberg editor in WordPress.

I wanted to add several GIFS to the post. However, it was a really frustrating process.

First, there is no “GIF” block in Gutenberg, so that wasn't an option.

Second, I tried to use the default “Image” block in Gutenberg. That allowed me to upload the GIF, but the resulting image was static. I often lost all the movement in the GIF.

Third, I looked for a plugin to add a GIF block. There weren't any that I could find, except for those that relied on an external service such as Giphy.com.

So what's a poor GIF-using writer to do?

It turns out that Gutenberg does support GIFS in the WordPress core. It's just that the functionality is hidden.

Here's the solution I found …

• Use the default “Image” block in Gutenberg:

• Click “Upload” and select your GIF image:

• You will see your GIF inside your Gutenberg post.
• Go to the right sidebar and look for the “Image Size” option.

• Set this “Image Size” option to “Full Size”. This is what I missed in my first efforts … you have to choose the “Full Size” option for the GIF to work.

• If everything is set up correctly, you should see your GIF working in the admin area and also on the frontend when you publish the post. Here's an example:

So what's with the “Full Size” option?

This is because WordPress automatically makes multiple sizes of images when you upload them. WordPress does this to make sure your site runs quickly. Your site will automatically load lighter and faster images on mobile devices, but will load full-size images for retina-devices.

If you upload a GIF, all the resized versions of the image will lose their motion. Only the “Full Size” version will keep the GIF animation.

This isn't the only confusing feature of Gutenberg. We've written about the problem of rearranging metaboxes, how to hide image captions, how to hide blocks, and the difficulties with showing code in Gutenberg.

But, all-in-all, Gutenberg has still been a very positive experience for me as a writer. I love some the new features in plugins such as PublishPress Blocks. We're also looking forward to cool new features such as collaborative editing in WordPress. Most days, Gutenberg has me feeling like this:

---

Get the PublishPress plugins

The Pro versions of PublishPress plugins are ready for Gutenberg. They packed with extra features to help you manage your content. Get a PublishPress membership today for full access: