Over the years, many customers have asked how to implement countdown timers in their Unbounce landing pages. And who can blame them? With a countdown timer you can create a sense of urgency with your campaign, which can drive your conversions way up.
But why stop there? We've also made this countdown timer simple to add, easy to style in Unbounce, and with the option to fix it in the corner as to not disrupt your page designs.
Without further ado, we're happy to announce...
How To Add A Countdown Timer In Unbounce!
You can see this in action (built in Unbounce) here:
WARNING: YOU ARE ENTERING DEVELOPER TERRITORY
Here's the script: https://gist.github.com/noahub/c530eb73b31af677e3db9a80762acdf1
Create and style your timer on your landing page, as seen below. At minimum include a textbox element where your timer digits will be displayed and give it a default value. While you're at it though, why not spruce things up with a containing box and maybe a stopwatch icon?
Select your textbox, and click 'View Source'. Add
id=timer; to the innermost span surrounding your default text.
Replace the desired countdown duration in minutes.
Optional: Copy CSS to change the style of your timer when it reaches 00:00
Optional: Copy CSS to fix your timer to the bottom right corner of your page
Want to take your Unbounce landing pages + convertables to the next level?
Check out the Ultimate List of Unbounce Tips, Scripts & Hacks