Business Mar 17, 2021 2 min read

HOW TO ADD A DATE COUNTER ON A WORDPRESS WEBSITE

In this article, I will show you how I add a date counter on a WordPress website. As you can probably tell, I use the WordPress CMS self-hosted platform for this website and the majority of websites I manage.

The date counter is a great way to share your stories, show birthday announcements, share a date when an event is going to take place, or any other date-related information. I use the date counter to display my running streak. You will see this on the right-hand sidebar of my blog posts and it basically displays the number of days I’ve been running at least 5 KM per day.

HOW TO ADD DATE COUNTER ON WORDPRESS SITE The Simple Entrepreneur running streak

You want to do something similar or display any type of date counter then follow these steps.

  • Go to the Plugins and click on Add New
HOW TO ADD DATE COUNTER ON WORDPRESS SITE The Simple Entrepreneur plugins
  • Search for date counter
HOW TO ADD DATE COUNTER ON WORDPRESS SITE plugins date counter The Simple Entrepreneur
  • Click on Install Now
HOW TO ADD DATE COUNTER ON WORDPRESS SITE plugins date counter install now The Simple Entrepreneur
  • Click on Activate
HOW TO ADD DATE COUNTER ON WORDPRESS SITE plugins date counter activae The Simple Entrepreneur
  • Go to the Appearance and click on Widget
HOW TO ADD DATE COUNTER ON WORDPRESS SITE plugins date counter appearance widget The Simple Entrepreneur
  • Add a Custom HTML widget
HOW TO ADD DATE COUNTER ON WORDPRESS SITE plugins date counter custom HTML The Simple Entrepreneur
  • Use the shortcode
[DateCounter startDate="2019-10-14" endDate="now" format="Days"]
HOW TO ADD DATE COUNTER ON WORDPRESS SITE plugins date counter shortcode The Simple Entrepreneur

You can also use this on a blog post or page. All you have to do is add the shortcode in the content.

In my example, I made the date counter stand out by using HTML styles. If you want something similar use the following code:

<div class="datecounter" style="margin:auto; display:block;font-size:30px;font-weight:700;border-radius: 8px;background-color: #555555;padding: 16px;color:white;text-align:center;width:200px">
2463 DAYS 
</div>

Here’s also a video showing you how Ive added a date counter to my WordPress website.

Follow the journey

Get the next build note in your inbox.

Short updates from Marco on entrepreneurship, products, tools, family milestones, and the daily running streak.

This field is required.

Check your inbox or spam folder to confirm your subscription.