This is the documentation for the WP Flipclock plugin.
- Download the plugin here and upload
wp-flipclockfolder to the
/wp-content/plugins/directory, or search for it in the Plugins > Add New repository.
- Activate the plugin through the ‘Plugins’ menu in WordPress.
2. Adding A Shortcode
To use the plugin in your site, all you need to add to the page is the
[flipclock] shortcode to any post or page. This will display a basic flipclock like the example below.
There are various attributes you can add as well:-
- name – Give the flipclock a name. Default is “flipclock”. If you have more than one flipclock on any page it’s useful to give them unique names.
- countdown (True/False) – Allows you to count down to a date (true), or count up from a date (false). Default is false.
- date – Any date string, formatted how you like, which the clock will count up from/down to. Default is none.
- face (days/hours/minutes/24h/12h) – The face of the clock. Default is hours. Options are:-
- days – Days : Hours : Minutes : Seconds
- hours – Hours : Minutes : Seconds
- minutes – Minutes : Seconds
- 24h (from 1.6+ onwards) – 24 hour clock
- 12h (from 1.6+ onwards) – 12 hour clock
- seconds (from 1.4 onwards) – Allows you to hide the seconds field should you wish. Default is 1. Options are:-
- 1 – shows seconds
- 0 – hide seconds
- timezone (from 1.4 onwards) – Sets timezone for date. Now it shows the correct time before the event. The time zones have unique names in the form “Area/Location”, e.g. “America/New_York”. Default is UTC.
- lang – Changes the language of the labels (days,hours,minutes,seconds). Supported languages: Arabic, Chinese, Danish, Dutch, English, French, German, Italian, Latvian, Nowegian, Portugese, Russian, Swedish, Spanish. Default is English
- hidelabel (from 1.6 onwards) – Hides the label above the clocks. Default is false
Here’s a couple of examples for you.
To count down the amount of days until New Years Day 2050[flipclock countdown="true" date="1st January 2050" face="days" name="countdown"]
To count up the amount of hours since Christmas Day 2010, hiding the labels[flipclock date="25th December 2010 10:00pm" name="countup" hidelabel="true" name="christmas"]
To Count Down to Christmas Day 2020 in Moscow (GMT +0300) with Russian labels and seconds will be hidden[flipclock countdown="true" face="days" date="25th December 2020" seconds=0 timezone="Europe/Moscow" lang="russian"]
24 Hour Clock[flipclock face="24h"]
For more examples, we’ll be releasing them over time. To receive them, please subscribe to our newsletter.
5. Frequently Asked Questions
How do you reduce the size of the clock?
Unfortunately, at the moment, WP Flipclock doesn’t allow resizing of clocks due to the flipclock.js doesn’t allow it. If you wish for this to be the case, submit an issue here.
I have multiple clocks on one page, some with labels, some without. All labels are hidden, how come?
Unfortunately, there is an issue with flipclock.js not adding in any way to differentiate between different clock labels. As a result, we struggle to target the element we need to.
If you want this put into the plugin, please submit an issue to flipclock.js.
6. Further Support
Support can be provided in one of two ways:-