Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

How to Add Click to Load for GIFs in WordPress

Do you want to add a click to load GIF player on your WordPress website? Animated GIF images take longer to load which affects page speed and user experience. That’s why many popular blogging platforms don’t auto-load GIFs in their apps. In this article, we will show you how you can easily add click to load for GIFs in WordPress.

Adding click to load for Gifs in WordPress

Why Add Click to Load for GIFs in WordPress?

If you often add animated GIF images in WordPress, then you already know that they are way larger in size than regular images. This means they take longer to load which affects your website speed and performance.

Some websites deal with this by lazy loading images in WordPress. However, this still affects users experience because GIFs take longer to load as the user scrolls down.

Popular platforms like Tumblr and others use click to load GIF player to mitigate this problem. Instead of loading all frames in a GIF animation, they load just the first frame of the animation. A play button or GIF label on the image indicates that users can click to view the animated GIF.

Paused GIF example

That being said, let’s take a look at how you can add click to load button for GIFs on your WordPress website.

Adding Click to Load for GIFs in WordPress

First thing you need to do is install and activate the WP GIF Player plugin. For more details, see our step by step guide on how to install a WordPress plugin.

This plugin works out of the box, and there are no settings for it.

You can head over to the post edit screen to see it in action.

Add GIF button in WordPress post editor

On the post edit screen, you will notice the Add GIF button above the post editor. Clicking on it will bring up the media uploader popup where you can upload your GIF images similar to any other image.

Upload GIFs using the Add Gif button

Once uploaded, you need to click on the Insert image button to continue.

The WP GIF player plugin will now add the required shortcode in your WordPress post editor.

GIF shortcode in WordPress post editor

You can now save your post/page and click on the preview button to see your click to load GIFs in action.

All the GIFs embedded on your post will now have a button on top of them labeled GIF. Clicking on the button will load the animated GIF in the background and display it.

Click to play animated GIF

One downside of this plugin is that it only works for the new GIFs that upload. It will not add click to load for GIFs uploaded using the normal WordPress media uploader. This means all your previously uploaded GIFs will not have the click to load button.

We hope this article helped you learn how to add the click to load GIFs player in WordPress. You may also want to see our guide on how to fix common image issues in WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

Editorial Staff

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

5 CommentsLeave a Reply

  1. Umair

    That plugin is no longer available. Any other suggestion?

    • WPBeginner Support

      Not at the moment, we will be sure to keep an eye out for alternatives.

      Admin

  2. Cori Ramos

    Thank you for telling us about this plugin and for showing us how to use it. I’m going to hang on to this one!

    Cori

  3. Shafi Khan

    That’s a cool plugin. I wonder if we can customize the button and change it’s location. It would be so cool to have a brand-logo button in the center and a GIF text on top-right corner.

    Thanks for sharing.

  4. Vladimir DJurovic

    This is quite interesting. I don’t use animated GIFs in my posts yet, but it’s good to know.
    Do you know if this approach will work with CDN hosted content?

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.