How to use the Dynamic GIFs plugin

The Dynamic GIFs plugin lets you create animated GIF countdown timers and personalized images for inserting into email campaigns.

Have you received any marketing emails telling you an offer is running out of time with a countdown timer animation in the email? Or have you ever received an email that contains an image with personalized text on it, such as including your name?

If you have and you’ve wanted to send similar emails, Uncle Chuckles’ Dynamic GIFs plugin will help you create your countdowns and images.

Before we start looking at how to use the plugin, a word of warning. If your WordPress is on cheap shared hosting, your web host may not be happy with you running this plugin, particularly if you have a big list. I will explain later how you can monitor how quickly the plugin is creating the images and the memory it’s using.

If you haven’t got a copy of the Dynamic GIFs plugin yet, you can download a free copy from here. This article explains how to install a downloaded plugin.

Once installed and activated, you’ll find a new UC GIFs menu item towards the bottom of the admin menu.

Countdowns

Click the Configure new countdown GIF button to open the form.

The countdown time animations will use the web server’s clock to work out how much time is left when creating each countdown animation.

If the server for your website is in a different timezone to you, the server’s clock may be set to a different timezone. Even if you know the server is in your timezone, it’s clock could still be set to another timezone.

At the top of the form, the current date and time of your web server’s clock is displayed. You can use this information to calculate the end date and time for your countdown.

Enter a Countdown Name. This is for your own internal use and won’t be seen by end users.

Set the end date, remembering that you may need to compensate if your server’s clock is different to yours.

For example, let’s say you want to end your countdown at midnight your time, which equates to 00:00 tomorrow. If your server’s clock is showing a time two hours earlier than your time, you will need to set the date to today’s date. If the server time is the same as your time, you’d need to set the date to tomorrow’s date.

Again, when setting the end time, you may need to adjust it based on the server time. So if you wanted to end at midnight and the server is showing a time two hours earlier than you, you’d need to set the time to 10:00.

You can use the color picker to set color of the digits and labels and the background color. You’ll usually want the background color to match the background color of your emails.

Then click the Save countdown button.

It will take a few moments to save the new countdown, close the form and show the newly added countdown in the list of countdown images.

Click the Copy URL link to get the GIF URL and paste it into the address bar of a new tab.

You should see an animated GIF something like above in the new tab.

If you watch it for a minute, you’ll see that it loops back to the beginning and starts again. This is a common technique with these animated countdown GIFs. It’s the only practical way to create these and very few people will ever notice.

You can edit a countdown animation by clicking the countdown name to load it back into the form. To delete a countdown you no longer need, click the X icon and confirm you want to delete it.

Personal

Click the Personal tab and then the Configure a new personalized GIF.

Enter a name so you can recognize what this image was created for. This is just for internal use and isn’t seen by end users.

Enter the text that you want to display on your image. You must enter line breaks manually, though you may have to tweak this after you add your image.

Use [[REPLACE]] as a placeholder for the personalized text that you want to insert,, such as your subscribers’ first name. I’ll explain how to personalize the text and replace this placeholder after I cover the rest of the controls for creating the personalized image.

Click the Select Image link to open the media library and upload or select the image you want to use.

You can click and drag on the text box to move it around and click and drag the corner handles to change the shape and size of the box. Get the box to the approximate size and position.

Use the Font drop down selector to set the font you want to use and the Text Color color picker to set the color you want to apply to the text.

Use the Text Size slider to adjust the size of the text so it fits in the text box. You can also edit the text and add or remove line breaks. Note that when the image is created, if necessary, the text will be shrunk to ensure it fits the space set by the text box.

Use the Text Angle slider to rotate the text box. You can drag the text box and use the one corner handle to adjust the size ass required.

When you’re happy with the text position, click the Save personalized GIF button.

Click the Copy URL text, open a new tab and paste the copied URL into the addres bar.

You should see a demo of your image with the placeholder replaced with “Chuckles”.

To edit a personalized image, click it’s name to open the form and click the X icon next to the name to delete an image you don’t need anymore.

Personalizing the text

To display your personalized image in an email, you will need to replace the “Chuckles” text in the copied URL with the placeholder or merge text specified by your email service.

So you will have copied a URL similar to this

https://yoursite.com/uc_personal/1649614170/?str=Chuckles

If you use Mailchimp and want to how the recipient’s first name, you’d replace Chuckles with *|FNAME|*

https://yoursite.com/uc_personal/1649614170/?str=*|FNAME|*

Checking performance

I mentioned early on that some low cost web hosts may not be happy with this plugin if you have a lot of subscribers. If you have any concerns about performance, you can run some tests.

The plugin allows you to track how much memory is used to create images and how long they take.

You can check the performance by adding a variable called test to the image URL and you will be emailed the memory used and time taken. Check your spam for this email.

https://yoursite.com/uc_personal/1649614170/?str=Chuckles&test

If you prefer, you can add a variable called log to the image URL and the stats will be written to a file called debug.log in the wp-content directory of your site. Delete the file after use.

https://yoursite.com/uc_personal/1649614170/?str=Chuckles&test&log

With both those example URLs, remember to change the them to the URL for your image.