---
title: "How to Add a Countdown Timer in WordPress?"
url: https://nexterwp.com/docs/add-a-countdown-timer-in-wordpress/
date: 2024-12-09
modified: 2026-04-14
author: "Aditya Sharma"
description: "Creating a sense of urgency can significantly enhance user engagement and drive conversions on your website. One effective way to achieve this is by incorporating a countdown timer in your..."
image: https://nexterwp.com/wp-content/uploads/2024/12/How-to-Add-a-Countdown-Timer-in-WordPress_-1024x519.jpg
word_count: 739
---

# How to Add a Countdown Timer in WordPress?

## Key Takeaways

- Nexter Blocks Countdown block adds three countdown types: Normal, Evergreen (Pro), and Fake No (Pro).
- Countdown Expiry offers four end actions: None, Message, Pattern (Pro), and Redirect.
- Countdown labels let the editor show or hide Days, Hours, Minutes, and Seconds text, but the Label tab is not available for the Fake No counter option.
- Style tab controls countdown typography, color, padding, margin, border, background, and separate label styling for the Countdown block.

Creating a sense of urgency can significantly enhance user engagement and drive conversions on your website. One effective way to achieve this is by incorporating a countdown timer in your WordPress site.

With the Countdown block from Nexter Blocks, you can easily add different types of countdown timers to your WordPress website.

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-countdown-timer/)

## Required Setup

- Make sure the default WordPress Block editor is active. 

- You need to have the [Nexter Blocks](https://wordpress.org/plugins/the-plus-addons-for-block-editor/) plugin installed and activated.

- Make sure the Countdown block is activated, to verify this visit Nexter → Blocks → and Search for Countdown and activate.

- This is a Freemium block, to unlock the extra features, you need the [PRO version of Nexter Blocks](https://nexterwp.com/pricing/?utm_source=tpag&utm_medium=docs&utm_campaign=text).

## Learn via Video Tutorial

https://www.youtube.com/watch?v=NDRUShspxfM&t=4s

## How to activate the Countdown Block?

Go to 

- **Nexter **→ **Blocks **

- **Search **the block name and** turn**** on the toggle**.

![](https://nexterwp.com/wp-content/uploads/2024/12/Nexter-Blocks-Countdown-Activation.png)

## Key Features

- **Multiple Countdown Types **- You can choose from three countdown types Normal, Evergreen (Pro), and Fake No (Pro).

- **Multiple Countdown Styles** - You can choose from multiple countdown styles.

- **Show Message** - You can [show a message after the countdown timer ends](https://nexterwp.com/docs/show-custom-text-message-after-countdown-timer-ends-in-wordpress/).

- **Show WordPress Pattern** (Pro) - You can [show content using a WordPress pattern after the countdown timer ends](https://nexterwp.com/docs/show-a-particular-wordpress-pattern-template-after-countdown-ends/).

- **Page Redirect** - You can easily [redirect to a new page after the countdown timer ends](https://nexterwp.com/docs/redirect-to-different-page-after-wordpress-countdown-ends/).

## How to Use the Countdown Block?

Add the Countdown block to the page.

Then click on the **Design from Scratch** button to design the layout from scratch.

![](https://nexterwp.com/wp-content/uploads/2024/12/countdown-design-type-1024x192.png)

> *Note: By clicking on the Import Pre-Designed Template button, you can [import a preset template](https://nexterwp.com/docs/import-templates-in-nexter/#Import-Preset-Designs-for-Specific-Blocks-in-Nexter) and customize it as per your requirements.*

### Countdown Options

From the **Countdown Setup **section, you have to select the countdown type. Here you’ll find three options -

- **Normal **- To [create a normal countdown](https://nexterwp.com/docs/add-wordpress-countdown-timer-in-hello-top-bar-sale-fomo-banner/).

- **Evergreen** (Pro) - To [create a scarcity or evergreen countdown timer](https://nexterwp.com/docs/create-an-evergreen-countdown-timer-in-wordpress-loop-cookie-based-timer-per-user/).

- **Fake No** (Pro) - To [create a fake number counter](https://nexterwp.com/docs/add-a-fake-scarcity-counter-in-wordpress/).

Select the option as per your requirements, let’s select Normal here.

You can select a countdown style from the **Countdown Style** section.

You’ll see an **Inline Style** toggle option for the Simple style only, from here you can make the countdown timer layout inline.

Then in the **Time** and **Date** sections, you have to set the countdown end date and time.

> *Note: The time will be set based on your time zone.*

### Action After Countdown Ending

From the **Countdown Expiry** section, you can set different actions after the countdown ends. Here you’ll find four options - 

![](https://nexterwp.com/wp-content/uploads/2024/12/countdown-expiry-new.png)

- **None** - With this option, nothing will happen after the countdown ends.

- **Message** - With this option, you can [show a message after the countdown ends](https://nexterwp.com/docs/show-custom-text-message-after-countdown-timer-ends-in-wordpress/).

- **Pattern** (Pro) - With this option, you can [show any content using a WordPress Pattern after the countdown ends](https://nexterwp.com/docs/show-a-particular-wordpress-pattern-template-after-countdown-ends/).

- **Redirect** - With this option, you can [redirect to another page after the countdown ends](https://nexterwp.com/docs/redirect-to-different-page-after-wordpress-countdown-ends/).

> *Note: The Countdown Complete option is only available with the Normal countdown option.*

### Label

From the **Show Labels** toggle, you can show or hide the labels from the counter. When enabled, you’ll see individual label options -

![](https://nexterwp.com/wp-content/uploads/2024/12/countdown-show-label-new.png)

- **Days Section Text** - From here, you can manage the Days label.

- **Hours Section Text** - From here, you can manage the Hours label.

- **Minutes Section Text** - From here, you can manage the Minutes label.

- **Seconds Section Text** - From here, you can manage the Seconds label.

> *Note: The Label tab is not available for the Fake No counter option.*

## How to Style the Countdown Block?

To style the Countdown block, you’ll find all options in the Style tab.

**Counter Styling** - From here, you can manage the countdown timer typography, color, padding, margin, border etc. You can also manage the countdown label color, background and border individually as well.

![](https://nexterwp.com/wp-content/uploads/2024/12/countdown-style-new.png)

**Expiry Message** - You’ll see this option when the Message option is selected in Countdown Expiry. From here, you can manage the message style. 

**Label Styling** - From here, you can manage the label padding and margin.

**Fake Message** - You’ll see this option when the Fake No option is enabled. From here, you can manage the message alignment, typography, color, padding, margin, border etc.

**Fake Number** - You’ll see this option when the Fake No option is enabled. From here, you can manage the counter number style.

**Background** - From here, you can manage the countdown timer container background style.

Advanced options remain common for all our blocks, you can explore all the options from here.

[View Advanced tab tutorial.](https://nexterwp.com/docs/add-advanced-tab-in-wordpress/)