Migration Guide v3 to v4

We’ve simplified & standardized the css classes for Checkout Countdown in v4.

The following breaking changes apply to those who have customized the CSS outside of the plugin.

The CSS IDs were originally used in early versions of the plugin, they were kept for years due to backward compatibility. There’s a chance you weren’t even using them, but it’s worth checking.

Removed Classes

The CSS ID #cc-countdown has been removed. You should use .checkout-countdown-wrapper instead.

cc-shortcode cc-countdown

cc-countdown-wrap

ccfwoo-is-hidden

cc-countdown-timer

How you should target CSS

New CSS classes for countdown state

We’ve also introduced dynamic classes that are added to depending on the state of the countdown. These classes will allow to further customize the look and feel of the countdown while it’s counting, or expired.

checkout-countdown-is-counting

checkout-countdown-is-hidden

checkout-countdown-is-expired

Current CSS classes

Shared Classes for Bar, Notice, Shortcode

checkout-countdown-wrapper

checkout-countdown-content

Bar class

checkout-countdown-bar

Shortcode class

checkout-countdown-shortcode

Notice class

checkout-countdown-notice

Loading classes

checkout-countdown-loading

checkout-countdown-loading-dot