Want to add a countdown in WordPress? A countdown timer helps you showcase important achievements, anniversaries, upcoming events, and more. In this article, we will show you how easy it is to add a countdown timer in WordPress.
When and why is the Milestone countdown widget needed?
Milestone Countdown Widgets are a useful tool to remind your audience of an important milestone in your business, an upcoming event, a product launch, or a sales event. This helps create expectations among your customers and increases user engagement.
Below are some common scenarios in which you can effectively use the stage countdown widget:
- Before launching your website on the next page.
- During site maintenance, so that visitors know when the site will be available again.
- Before introducing a new product or service.
- When holding an event or conference.
- On the birthdays of your online business.
- Holidays and sales like Black Friday offer big discounts on your products or services.
Let's see how easy it is to add a countdown widget to WordPress.
Method 1: Adding Milestone Countdown Widget Using Ultimate Plugin
Countdown Timer Ultimate is a simple free plugin that lets you add a basic countdown timer to your website.
The first thing you need to do is install and activate the Countdown Timer Ultimate plugin . For more information, see. Our step by step guide to have a WordPress plugin hold is reached .
Upon activation, you need to visit the Countdown Timer »Add Timer page in your WordPress admin area.
On this page, you need to start by adding the milestone name as a title for the new countdown timer.
Note: The timer uses the time zone set in your WordPress site settings. If you want to change the time zone for this countdown timer, you will need to go to Settings »General and update your WordPress site's time zone settings .
After that, you can scroll down to set the expiration date, day and time for the countdown timer.
Then you need to choose an animation style from the dropdown list. You can also easily adjust the circle and background width.
In the Countdown Width box, you can define the width for the complete display of your countdown widget. If you leave this field blank, the timer will be displayed at its default size.
After that, you can add background and foreground color for the countdown timer. You can individually change the color for days, hours, minutes and seconds. You can also change labels for items such as days, hours, etc.
It should be borne in mind that the plugin, unfortunately, does not configure the label for the plural or singular, so, for example, it will say "1 hour" instead of "1 hour".
Once you're satisfied with the settings, go ahead and click the Publish button .
Displaying your Milestone Countdown Widget in WordPress
Now that you've created your milestone countdown widget, let's add it to your site.
First, you need to click on the countdown timer menu. On the WP Countdown Timer page, you will see the timer you just created.
Next to the countdown timer, you will see a shortcode that needs to be copied.
You need to copy and paste this shortcode into the content area of your post or page . Then don't forget to hit the refresh or publish button to save your changes.
You can now visit your website to see the milestone countdown widget in action.
You can also add this countdown timer to the sidebar of your WordPress site. Just go to Appearance »Widgets page and add a Text widget to your sidebar. In the widget settings, you need to insert a shortcode for the countdown timer.
When you're done, don't forget to click the Save button to save your widget settings.
You can now visit your site to see your countdown sidebar widget in action.
Method 2: Adding a MileStone Countdown Widget with OptinMonster
OptinMonster is the best WordPress popup plugin on the market, but it does a lot more than just popups. This will help you convert abandoned visitors into subscribers and customers.
Using OptinMonster's countdown timer feature, you can integrate a milestone countdown timer into a lightbox popup, sidebar widget, floating bar, or any other type of OptinMonster campaign.
Below is an example of one of the pre-built countdown timer campaigns they have, but you can use the drag and drop builder to create a fully customizable countdown timer.
OptinMonster is a clever way to showcase a countdown timer in high-profile design elements. They even let you create evergreen countdown timers in WordPress.
To get started, you need to visit the OptinMonster website and sign up for a plan that suits your needs.
After that, you need to install the OptinMonster plugin on your WordPress site. This plugin will act as a connector between your WordPress site and the OptinMonster app.
Upon activation, you will need to go to OptinMonster »Settings from the WordPress admin menu and connect your account.
You can click the Connect Existing Account button to get started.
After that, you will see a pop-up window. Just select the email address you used to register your OptinMonster account and click the Connect to WordPress button.
The plugin will now connect your WordPress site to your OptinMonster account.
Once connected, you can start creating a new campaign from your OptinMonster dashboard. Just go to OptinMonster »Campaigns and click on the Create Your First Campaign button.
You can use any type of campaign and integrate a countdown timer into it.
Method 3: Adding a Milestone Countdown Widget Using SeedProd
SeedProd is the best landing page builder for WordPress . Its drag and drop builder lets you create stunning landing pages and add a countdown timer to grab the attention of your visitors.
To use the countdown timer feature, you need the SeedProd Pro version . With the Pro plan, you can also access a variety of templates, custom page blocks, email marketing integrations, and more.
The first thing you need to do is install and activate the SeedProd Pro plugin on your WordPress site.
Upon activation, you will be redirected to SeedProd in your WordPress admin area. It will ask for a license key, which you can get from your SeedProd account. After entering the license key, you can click the "Confirm Key" button.
Then you can create a new landing page by going to SeedProd »Pages .
SeedProd lets you customize a variety of page types, including Coming Soon Pages, Login Pages , Custom WooCommerce Cart Pages, and 404 Pages .
You can also create other landing pages by clicking the Add New Landing Page button, such as a thank you page or a webinar registration page.
In this tutorial, we'll be using the Coming Soon page as it's a great place to add a countdown timer and remind your audience of an upcoming product or event.
After that, you can choose a template for your landing page. It is also possible to create a page from scratch using a blank template.
However, we recommend using a template as it saves time and helps you edit the design the way you want.
The next screen will take you to the SeedProd drag and drop page builder under the Design tab.
Here you can customize your landing page by adding and removing various sections, page blocks, and formatting the page layout.
To add a countdown timer, simply go to the Additional Page Blocks section in the left menu and place the Countdown block anywhere on your page.
You can also edit various sections of your future page. Just click on a section and you will see more options in the left menu.
For example, you can edit the text in a field, change its font, color, or align the content.
When you're done editing the design of your landing page, you can go to the Connect tab and integrate your email marketing services . SeedProd supports popular services such as Drip, Constant Contact , SendinBlue , ConvertKit and others.
Then go to the Page Setup tab to publish your landing page with a countdown timer.
In general settings, you can change the "Page Status" from "Draft" to "Publish" and your page will be active.
You can then navigate to the Access Control settings under the Page Settings tab and specify who can view your landing page.
This feature is really useful when you want certain people to crawl around the upcoming page and start developing your site.
SeedProd also allows you to include and exclude URLs that will display the soon-to-be page. By default, the page will be visible throughout the site. However, you can change it so that it only appears on the home page or at specific URLs.
After that, you can optimize your page for search engines by going to SEO settings. SeedProd allows you to add SEO title, description, icon and social media thumbnail.
If you'd like to add code snippets to your landing page, go to the Scripts section in the page settings. This is where you can add scripts to the header, header, and footer of your page.
For example, you can add Google Analytics tracking code in your header scripts to see how people are using your landing page.
When you are satisfied, do not forget to click the "Save" button. You can also preview your landing page to make any design changes.
Then you need to go to SeedProd "Pages and change the status of your future page to" Active ".
You can now visit your site to see how soon the counter is in action.
We hope this article helped you learn how to add a milestone countdown widget in WordPress.
