WordPress Countdown Widget comes with a handy shortcode functionality, allowing you to embed countdown 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 the plugin page: WordPress Countdown Widget

Shortest Option with Default Display

[countdown date="6 August 2024"]
[countup date="29 October 1923"]

Showing Only Weeks and Days instead of Hours

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

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

Adding an Event Title below the Countdown

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

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

 

Adding Hours and Minutes

If no time is added countdown uses midnight as a base. If you want to countdown to or count up from a specific time you can add an 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 2024" 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