Number Counter Widget

Number Counter Widget Features

Create animated number counters for stats, KPIs, milestones, ratings, totals, and achievements. Customize counter values, icons, layouts, animations, live JSON data, colors, accessibility text, and custom CSS in a no-code builder.

Create Your Number Counter Widget - It's Free!
Number Counter Widget Features Hero Bg Image

How to embed Number Counter Widget to WordPress

1Get your embed code

After customizing your Jotform website widget, click Try it on your website for free, and copy the generated embed code.

2Open the page editor

Go to the WordPress post or page where you want to display the widget, then add a new block.

3Add a Custom HTML block

Select Custom HTML and paste your Jotform Website widget embed code into the HTML field.

4Update and view

Click Update or Publish, then open the page to check your embedded widget.

Create multiple counter blocks

Display up to eight statistic blocks for the numbers your visitors need to notice. Add target values, start values, prefixes, postfixes, titles, descriptions, built-in icons, custom image icons, links, and JSON key paths for each counter.

Counter fields include:

Target valuePrefix/postfixIcon or imageLink URL
Add Counters
Create multiple counter blocks

Fit counters to your layout

Choose grid, card, minimal, or stacked layouts to match the space on your page. Adjust desktop columns, mobile columns, widget width, spacing, and alignment so your counters stay clear across different sections.

Layout controls include:

GridCardsMinimalStacked
Choose Layout
Fit counters to your layout

Animate and refresh values

Make important numbers easier to notice with count-up animation, fade-up animation, decimal places, and number formatting. Connect optional external JSON data and set refresh intervals when published counters need updated values.

Behavior controls include:

Count upFade upJSON endpointRefresh interval
Set Behavior
Animate and refresh values

Match counters to your brand

Start with light, dark, or vivid themes, then fine-tune the full visual style. Set custom colors for backgrounds, cards, numbers, text, and icons, and adjust typography, corner radius, branding, and scoped CSS.

Style controls include:

Theme presetsCustom colorsTypographyCustom CSS
Style Counter
Match counters to your brand