Best SEO and PPC Tool - Extended Free Trial  GO!

How to Add a GIF in Elementor

Last modified: June 26, 2022

Cloudways

Are you looking into how to add a GIF in Elementor? Then use these instructions to add these images to your website with ease.

Show More

* This button will show the rest of the post and open up an offer from a vendor

Why Add a GIF to WordPress?

GIFs are great ways to add attention-seeking images to your blogs and pages. They can help increase engagement and keep audiences on your website for longer. However, if you add an animated GIF to your WordPress website, there is the common problem that the animation is lost.

The reason for this is that WordPress automatically generates multiple sizes of the images, but it will only do so from the first frame of the animation. Therefore, the images that are saved are just the first frame of the animation.

That doesn’t mean that it can’t be done. Instead, you want to be using Elementor and get the website builder to help you build a better design where you can easily add GIFs without a problem.

How to Add a GIF in Elementor

The first step for anything is that you’re going to have a new page or open up a page/blog post for editing. Once inside there, you need to create a new image section or go to the image section where you would like the GIF to be added.

Ensure that you go into the section where you can add a new image into this section. Then you can click on the ‘Upload’ button and select the GIF from your computer. Alternatively, you can select the ‘Media Library’ option and choose a GIF that has already been added to your website.

Do not use the link to your GIF by clicking on the option to ‘Insert from URL’. From experience, this doesn’t help you to upload GIFs and is better for static images.

The GIF should take several moments to install. Then you will need to select the ‘full size’ option from the ‘Image Size’ option on the right-hand side menu.

The full-size image is the original animated GIF you uploaded by you a moment ago. Using this option prevents WordPress from using static images and not playing the animation.

When you’ve completed the changes that you want on your website, you can update or publish the page. Then you should visit the page to check that the GIF is working.

Final Word: How to Add a Gif in Elementor

When it comes to using GIFs on your website, be sure that you’re not using too many on any single page. This can significantly slow down your website. For every second that it takes for your website to load you’re going to lose about 7% of your revenue.

The simple steps on how to add a GIF in Elementor showcase how simple the process can be. It can be used across numerous pages and blog posts and even multiple times on the same page. Just be sure that you heed the worry that is mentioned above.

Recap:
Save 4 Later
Email liked links to yourself