Reference


Structure

Smart Countdown FX widget structure is illustrated by the image below. The terms (titles, counter, units, digits, labels) are used throughout the documentation, please refer to this scheme if you have doubts.

Widget layout legend

Widget (“shortcode compact” layout)

Built-in layout presets

Smart Countdown FX supports different layouts. Basic layout presets are included in the installation package:

  • Sidebar – units are placed in a column, labels position: right
  • Sidebar compact – units are placed in a column, labels position: bottom
  • Sidebar labels left – units are placed in a column, labels position: left
  • Sidebar non-responsive – units are placed in a column, labels position: right, responsive behavior disabled
  • Shortcode – units are placed in a row (inline), labels position: right
  • Shortcode compact – units are placed in a row (inline), labels position: bottom
  • Shortcode compact non-responsive – units are placed in a row (inline), labels position: bottom, responsive behavior disabled
  • Shortcode compact titles inline – all elements including event titles are placed in a row (inline), labels position: bottom (if there is not enough space for the widget this layout is very likely to be converted to “Shortcode compact” right away – responsive behavior)

Refer to Layout Presets Fine-tuning if you wish to add/edit layouts.

Smart Countdown FX options

Widget option Shortcode attribute Description Shortcode values and comments
Title Widget title not used in shortcode
Basic settings
Event date and time deadline Date and time in MySQL format 2015-02-03 23:00:00 stands for FEB 03 2015 11:00p.m.
Import events from import_config Appears only if at least one event import plugin is enabled. Choose the desired configuration – event dates with be then automatically pulled from the selected external application or service. “Event date and time” setting will be ignored. see event import plugin documentation for attribute values
Counter display mode mode Widget display conditions.”Auto…” (default) will always show countdown before event and count up after event time arrives. “Countdown – no limit” – show countdown only (widget will be hidden after event time arrives), “Count up – no limit” – show count up only (widget will be hidden before event). Other options – select from drop down list.

If at least one event import plugin is enabled another option is added: “Auto + countdown to event end while in progress” – show countdown to event start before event, show countdown to event end during the event.

  • “auto” (default) – shorthand value, equal to “countdown:-1,countup:-1
  • “countdown” (shorthand value, equal to “countdown:-1,countup:0”)
  • “countup” (shorthand value, equal to “countdown:0,countup:-1”)
  • “countdown:NNN,countup:MMM” where NNN – time before event (in seconds) when the widget is displayed, MMM – time after event (in seconds) while the widget is visible. Use -1 as a special value to disable time limit.
  • “countdown_to_end” – countdown to event start before event, countdown to event end during the event (only available if compatible event import plugin is installed)
Title before the counter for countdown mode title_before_down Event title part displayed before the counter block in countdown mode. Safe HTML markup is allowed. Plain text, double-quotes are not allowed. Use “extended shortcode” notation to insert HTML markup in titles.
Title before the counter for count up mode title_before_up Event title part displayed before the counter block in count up mode. Safe HTML markup is allowed. Plain text, double-quotes are not allowed. Use “extended shortcode” notation to insert HTML markup in titles.
Title after the counter for countdown mode title_after_down Event title part displayed after the counter block in countdown mode. Safe HTML markup is allowed. Plain text, double-quotes are not allowed. Use “extended shortcode” notation to insert HTML markup in titles.
Title after the counter for count up mode title_after_up Event title part displayed after the counter block in count up. Safe HTML markup is allowed. Plain text, double-quotes are not allowed. Use “extended shortcode” notation to insert HTML markup in titles.
Counter animation profile fx_preset Type of animation used for digits transitions, select from built-in animations. More animations are available and can be easily installed. Animation profile filename with .xml extension, e.g. “Sliding_text_fade.xml” (default).
Widget layout preset layout_preset Widget layout, select from predefined layouts. New layouts can be easily created. Layout preset filename with .xml extension, e.g. “shortcode_compact.xml” (default).
Use titles for count up mode as “Time has arrived” message hide_countup_counter Check to enable “Time has arrived” message instead of counting up from event. “0” – normal mode (default), “1” – counter hidden in count up mode, only event titles displayed.
Display counter units units Check counter units to be used in counter display
  • “*” (default) – display all
  • comma-separated list of units to display: “years,months,weeks,days,hours,minutes,seconds” will have the same effect as “*”
  • “-” (minus sign) followed by comma-separated list of units to hide, e.g. “-weeks,seconds” will have the same effect as “years,months,days,hours,minutes”
Sizes
Text before counter size text_before_size Title before counter font size in pixels Integer value without “px”, e.g. text_before_size=”32″
Text after counter size text_after_size Title after counter font size in pixels Integer value without “px”, e.g. text_after_size=”28″
Digits size digits_size Counter digits font size (for image-based animations – digit images size) Integer value without “px”, e.g. digits_size=”50″
Labels size labels_size Counter labels font size in pixels Integer value without “px”, e.g. labels_size=”16″
Redirection
Redirect to URL on contdown zero redirect_url URL to redirect when countdown reaches zero, must be an absolute URL starting with http(s):// URL to redirect to, similar to href attribute of a link, e.g. redirect_url=”http://example.com/blog”
Goto URL on widget click click_url URL to open when widget area is clicked, must be an absolute URL starting with http(s):// URL to open on click, similar to href attribute of a link, e.g. click_url=”http://example.com/blog”
Styles
Widget style widget_style CSS rules applied to widget container One or more CSS rules separated and ended by semicolons. Avoid font-size rule.
Text before counter style title_before_style CSS rules applied to event title text displayed before counter One or more CSS rules separated and ended by semicolons. Avoid font-size rule, use text size option instead.
Text after counter style title_after_style CSS rules applied to event title text displayed after counter One or more CSS rules separated and ended by semicolons. Avoid font-size rule, use text size option instead.
Counter digits style digits_style CSS rules applied to counter digits One or more CSS rules separated and ended by semicolons. Avoid font-size rule, use digits size option instead. Not all styles will have effect for image-base digits.
Counter labels style labels_style CSS rules applied to counter labels One or more CSS rules separated and ended by semicolons. Avoid font-size rule, use labels size option instead.
Miscellaneous
id Advanced usage only. Unique id of the widget on page. Normally it is generated dynamically so that no ids clash occur even when multiple countdowns are displayed on the same page. Use it only if you need a permanent widget id in DOM, e.g. for accessing it from another scripts.

Extended shortcode

Smart Countdown FX plugin supports HTML event titles. You can include HTML markup into shortcode title attributes using a “closing”

[smartcountdown deadline="2015-01-01 00:00:00"] ... [/smartcountdown]

shortcode. Four attributes can be defined within opening and closing tags:

  • [title_before_down] HTML goes here… [/title_before_down]
  • [title_after_down] HTML goes here… [/title_after_down]
  • [title_before_up] HTML goes here… [/title_before_up]
  • [title_after_up] HTML goes here… [/title_after_up]

The rest of the attributes should be defined inside the opening tag block in attribue_name=”attribute_value”, as usual.

Important! If at least one extended shortcode is used on a page, other “smartcountdown” shortcodes must be either extended or self-closing! Otherwise the content between the first opening tag and the last closing one will be interpreted as a single shortcode, thus leading to unpredictable results.

An example of “self-closing” shortcode:

[smartcountdown deadline="2015-01-01 00:00:00"/]

(pay attention to the slash right before the right square bracket)