WordPress Countdown Widget comes with a handy shortcode functionality, allowing you to embed count down timers anywhere in your posts or pages. On this page, you can find various usage scenarios for the countdown widget shortcode.

View more information on plugin page: WordPress Countdown Widget

Shortest Option with Default Display

[countdown date="6 August 2018"]
[countup date="17 October 1983"]

Showing Only Weeks and Days instead of Hours

Format string is used to display or hide certain elements of the countdown. You can find more information about format string here.

[countdown date="12 August 2019" format="wD"]

Adding an Event Title below the Countdown

If you want to display an event title below countdown you can use event attribute of the shortcode tag:

[countdown date="4 July 2019" format="d" event="Until Independence Day!"]

Adding Hours and Minutes

If no time is added countdown uses midnight as base. If you want to countdown to or count up from a specific time you can add hour and minutes to your shortcode as you can see in the sample below. Hours in the dropdown are 24 hours based.

[countdown date="5 June 2019" format="dHMS" hour="18" minutes="54"]

All Possible Attributes for the Shortcode

  • title="Widget Title" : Adds widget title before countdown widget
  • event="Event Title" : Event title that we are counting down
  • date="12 June" : This is a shorthand function for month, day and year. It depends on PHP strtotime function so it doesn’t work with every human readible format. Basic date format should be like 12 June 2020.
  • direction="down" : You can count down or up using this option.
  • timezone="+2" : Timezone of the countdown. This is required if you are creating a global countdown!
  • month="10" : Month of the countdown date
  • day="12" : Day of the countdown date
  • year="2020" : Year of the countdown date
  • hour="12" : Hour part of the countdown time
  • minutes="00" : Minutes part of the countdown time
  • seconds="00" : Seconds part of the countdown time
  • format="yowdHMS" : A key to hide/show certain digits on countdown. Check explanation here.
  • color="#900" : Text color of the countdown
  • bgcolor="#000" : Background color of the widget
  • width="200" : Width of the widget in pixels
  • height="200" : Height of the widget in pixels
  • radius="8" : Border radius of the widget in pixels
  • link="false" : Hides support link from the widget

See also

No Comments Join The Discussion