How to add a Countdown to your Twitter Profile Photo

“Wouldn’t it be cool to run a Twitter countdown to the Olympics? We could change the profile image each day to show how many days there are left!!”

That was my challenge. It took me a little while to work out, but I found a very elegant solution – which I hope will help you too. Obviously it can be used to countdown to any event – but with 6 months until the Olympic Cycling Road Race comes to Surrey, the Olympic opening ceremony will be my focus!

The effect

Every day, the Twitter profile image for the countdown account changes to show how many days are left. I created an animated gif of the profile image countdown so you can get the idea of what we are aiming for. One of these each day:

As well as changing the avatar, I want to schedule a tweet to go out each day to let people know how long it is until the Olympics start.

The thinking part…

Sending a countdown tweet would be easy – I could schedule that in CoTweet (at least until they axed the free version!)

Changing the profile image was the taxing bit. I could fairly easily create lots of profile images with a different number on each, but I was clear from the start I wanted to automate changing the images over – I haven’t got the time or patience to go into Twitter every day to change the image. On top of that, it should ideally change over at midnight – so it is accurate all day. I could then schedule to send a countdown tweet later in the day (when people would be awake to see it).

A quick Google later, the closest apps I could find were:

  • Twimsy an app that allows you to change your avatar to one of 9 previously uploaded versions by sending a message to @twimsy. I could schedule a tweet to change it, but would need to keep reloading new images…
  • Twiback an app that rotates through a number of pictures you preload. You can set what time it changes, but I couldn’t work out how to change the image to a particular picture.

I even looked at writing a PHP script and running a cron job…but my programming skills are really not up to it!

IFTTT to the rescue!

Then I remembered IFTTT.com. This awesome site allows you to easily join together different Channels, and set tasks that follow the description “If THIS then THIS“. For instance “If [I post to YouTube] then [post to my Twitter]“. That link will explain it far better than I can – go off and read it. I’ll wait!

In IFTTT parlance THIS is known as a trigger and THAT is an action. The action we want  is the “update Twitter profile photo” action. This requires a filename as an input.

My first plan was to trigger it at a certain date and time – but that would require 180 different IFTTT tasks (one for each day of the countdown). That was way too much work.

Then I thought of using the “every day at a certain time” trigger. The downside of this is I need a way of telling it which image to upload. I wondered about using an “addin” from the date/time trigger (this is a piece of information that the trigger passes to the action), but was struggling to connect the addin to the file name.

The solution

Finally, I had a brainwave…IFTTT can use Google calendar entries as a trigger, and the contents of the calendar as addins. If you know IFTTT then this is what we are aiming for:

The IFTTT Task for updating the profile picture based on a Google calendar

Whenever there is a calendar entry with a title containing the keyword “ProfilePic”, update the image of the Twitter account to the filename stored in the “Description” field of the calendar.

Read on for a more detailed explanation covering:

Next page: How to prepare the countdown images…

7 thoughts on “How to add a Countdown to your Twitter Profile Photo”

  1. Boundary Commission for Northern Ireland

    Superb work, we have just followed your excellent guide. Looking forward to midnight for the first update! Thanks

  2. Simon Radford

    Thank you for this – however I don’t know where you and the other satisfied users have been storing your images – EVERY SINGLE site I have tried mangled up the name with a random one – with potentially over a hundred images I was not going to be sorting that out.. I could see that the ifttt end was attempting to work from the google calendar (which I had set at hourly updates) but it couldn’t get any images and so failed. I have spent 9 hours on this and am now giving up. We will be doing it manually and at less than hourly intervals!

  3. Hello,

    Thank you for sharing. Please assist, my images do not display. I get an error message saying image not found though I followed all steps correctly.

    Kind regards.

  4. Hi. I’ve been meaning to write an update to this post for a while – but I need to test something first!

    The updated technique would be to store the base image on Cloudinary.Com (an account is required but for this purpose the account should be free) and then use dynamic image generation to add the countdown to the image.

    https://cloudinary.com/blog/how_to_overlay_text_on_image_easily_pixel_perfect_and_with_no_css_html

    I’ve not yet tested this, but there is no reason I can see why it wouldn’t work. Hope this helps.

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.