How to add a countdown timer
If you’re running a promo on your website, displaying a countdown timer will help you create a sense of urgency: the timer shows your website visitors that they’re running out of time and they better hurry up if they want to get the deal.
In Getsitecontrol, you can easily add a countdown GIF image generated by a third-party service to your promo widgets.
Follow the steps below to find out how to do that.
1. Create your countdown timer
First, create your countdown timer GIF. In this tutorial, we’re using Countdownmail.com to create our timer. Their server dynamically generates animated GIF images in real time.
Once you finish setting up and designing your timer, save the changes and copy the image source URL:
❗Please, note that you’ll only need the image URL, not the whole code from Countdownmail.com.
2. Place the timer to your widget
If you don’t have a widget yet or want to design a new one, click +Create widget in the Getsitecontrol dashboard.
Select a template from the Design Ideas gallery or create your widget from scratch. We recommend choosing a template that has an image because you can simply replace the image with the countdown timer.
Here is an example of a template you can grab and tailor to your needs:
When editing your widget, click on the image in the widget preview and hit Change image in the settings:
Next, switch to Upload and select From link. Paste the link you copied from CountdownMail into the corresponding field:
Click Set and you’ll see the timer on the widget, then press the OK button. The animated GIF timer has been added to your widget.
Next, you can adjust the timer’s size and position using the image settings.
In our example, we have applied the following changes to the image settings to make the countdown timer fit perfectly into our widget:
- changed the
Fitsettings to ‘Contain’ - reduced the overall width of the timer
- pushed it slightly to the bottom and to the right.
❗Feel free to tweak the image settings however you prefer to position the timer exactly where you want it to be, but make sure to select ‘Contain’ to display the whole timer on the widget.
Click Save & Close once you finish editing.
Done! As the server dynamically generates the GIF image in real-time, every time a visitor sees the widget on your website, they’ll see an updated GIF image of the timer.
If you face any issues while adding a countdown timer to your widget, do not hesitate to reach out to our tech Support team.