Settings#back to top

Counter Box Settings

Counter Type

  • Countdown to Date: Launch a classic countdown timer that reaches zero on a specific date and time you set. Perfect for creating anticipation for events like Christmas sales or product launches.
  • Weekly Countdown: Set a recurring countdown that resets each week on a specific day and time. use this to generate excitement for events like «Countdown to friday's happy hour!"
  • Time Since: Track the elapsed time from a chosen date in the past. This is ideal for showcasing milestones like "Years Since Google's Founding" or "Company Anniversary."
  • Simple Timer: Create a timer that counts down from a set duration and resets when the page refreshes. Motivate users to stay engaged by displaying a time-limited offer.
  • Personal Timer: Set a unique timer for each user that starts and resets after the timer expires, even if the user refreshes the page. This allows you to personalize offers or display time-sensitive discounts for each visitor.
  • Resumable Timer: Establish a persistent timer for each user that tracks the total countdown duration. When the user leaves the page, the timer pauses. Upon returning, the timer resumes counting down from where it left off. This is useful for limited-time promotions or gamification elements.
  • Base Counter: Create a versatile counter that can either count up or down to a specific value. This can be used for various purposes, such as displaying social proof by showcasing "Products Sold Today" or creating a sense of urgency with a "Limited Stock Remaining" counter.


Content#back to top

Counter Box Content

Shortcodes for Displaying Your Counter:

Once you've chosen your counter type, you can use shortcodes to display the specific units you want to show:

  • {day}: Displays the number of days remaining/elapsed.
  • {hour}: Displays the number of hours remaining/elapsed.
  • {min}: Displays the number of minutes remaining/elapsed.
  • {sec}: Displays the number of seconds remaining/elapsed (optional for most counters).
  • {counter}: Displays the raw counter value itself (e.g., current population, product count).

Customize Your Counter's Appearance:

Feel free to add any text or content alongside your counter using the standard WordPress editor tools.

You can also personalize the look of your counter using WordPress' built-in styling options. Change the color, font, and alignment to match your website's aesthetic.

This revised text clarifies the purpose of the shortcodes and emphasizes the customization options available through the WordPress editor.

Style#back to top

Counter Box Style

The "Style" tab gives you complete control over the appearance of your counter. Customize the following elements:

Number Styles:

  • Width & Height: Define the size of each number within the counter.
  • Border Radius: Set the curvature of the counter's corners for a rounded or sharper look.
  • Background: Choose a background color for the counter display area.
  • Border:
    • Style: Select the type of border (solid, dashed, dotted, etc.)
    • Thickness: Control the width of the border.
    • Color: Define the color of the border.