Plugin Countdown

Launch pages, sales and event sites all need the same element: a timer counting down to a date. This plugin adds it as a block, with the target date exposed as a component trait so the person editing the page sets it without touching code.

What it adds

One block and one component, both named countdown. The component renders days, hours, minutes and seconds, each as a separately styleable element under the countdown class prefix.

Options

• startTime — the default target date, for example 2030-01-25 00:00.
• endText — what replaces the timer once it expires. Defaults to EXPIRED.
• dateInputType — date or datetime-local, depending on whether your countdown needs a time of day.
• labelDays, labelHours, labelMinutes and labelSeconds — the unit labels shown in the component, which is where you localise it.
• style and styleAdditional — replace or extend the default CSS.
• classPrefix — change the generated class prefix from countdown.
• block and props — extend the block definition and the component properties.

Good to know

Install as grapesjs-component-countdown. BSD-3-Clause.