Count Down

Count Down block allows you to add countdowns to your page with customizable styles in an attractive way.

How To Add The Count Down Block

1. Open a page or a post and click on the plus icon to add a new block and look for the Count Down or you can search for it if it doesn’t pop up quickly for you.

2. By default, you'll get the below design-

How To Configure The Count Down Block

To configure the content of your Count Down block, switch to the ‘Content’ tab.

Countdown

Due Date - Set the due date and time for your countdown.

Display

Inline - This option allows you to display digits and labels inline.

Labels - Show or hide the Labels.

Days - Show or hide the Days display.

Hours - Show or hide the Hours display.

Minutes - Show or hide the Minutes display.

Seconds - Show or hide the Seconds display.

Custom Labels

This section has options that allow you to edit Label’s text.

How To Style The Count Down Block

Switch to the ‘Style’ tab to style all the elements of the Count Down block. You can customize ‘Connector’, 'Spacing' & ‘Color & Typography’ as per your preference.

Box Style

Box Spacing- Set the spacing between the countdown boxes.

Padding- Set the top, bottom, left, right padding within the countdown’s box.

Border- Set the border settings for the countdown block

Box Shadow- This option allows you to set box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Background Color - Set the background color of the box.

You can also set responsive Height, Width, Margin, Padding for the countdown box for Mobile and Tablet view.

Container Spacing

Container refers to the entire section which holds all the countdown boxes. This setting allows you to style and position this section.

Padding - Offers individual options to customize the Top, Right, Bottom, Left padding to the container.

Margin - Offers individual options to customize the Top, Right, Bottom, Left margin around the container.

You can also set responsive Padding and Margin to the container for Mobile and Tablet view.

Typography

Under the Typography section, you can set typography options such as Font Family, Responsive Font Size, Font Weight, Line Height, Letter Spacing, Color for Digits and Labels.