Topics Map > Campus Services > Web

Web - Adding a Countdown

How to properly add a countdown.

Step 1
Complete the Countdown feed form below:
  • Information
    • URL of page to display countdown on
    • Date to countdown to (MM/DD/YYYY)
    • Time to countdown to (HH:MM AM/PM)

Enter a number between 2000 and 3000.

Web Development Office Use Only

Step 1
Go to jQuery Countdown Website

Step 2
Fill out Step 1
A. Select "Countdown to custom time:" and select the date to countdown to.
B. Display style select "Big flip clock"
C. Display format select "Day counter"
Step 3
Copy the generated code in Step 2

Step 4
Edit the page the countdown is going to be on.

Step 5
Set the Text format to Full HTML of the JavaScript section.

Step 6

Paste code into JavaScript section.

Step 7

Delete the first 3 lines of code
<div class="clock-builder-output"></div>
<script type="text/javascript" src=""></script>
<script type="text/javascript" src="clock_assets/flipclock.js"></script>

Step 8
Change the "$" to "jQuery"

Step 9

Publish and save

Step 10
Go to JS Inject and Paste the Internal URL into the 3 Flipclock injectors
  • Flipdock
  • Flipclock 2
  • Flipclock 3
Step 11
Go to CSS Inject and Paste the Internal URL into the Flipclock injector
  • Flipclock

If you have questions, please contact the Web Development office at 608.342.1444 or  

Keywords:countdown webform development   Doc ID:60206
Owner:Tiffany N.Group:UW Platteville
Created:2016-01-27 14:33 CSTUpdated:2016-05-10 13:13 CST
Sites:UW Platteville
Feedback:  0   0