The Counter block is a dynamic tool that displays animated counter numbers, starting from zero to a specific value. The block is ideal for landing pages and portfolios to effectively highlight key data points, like statistics and milestones.

In this documentation post, we’ll show you how to use the Counter block of the plugin.

Adding the Counter Block #

Click the plus (+) icon on the editor. Type Counter in the search box. Once the block appears, add it to the editor.

General Settings #

After the block is added, come to the Settings tab. You’ll get options to configure the visibility control, animation, general setting, and responsive control.

Let’s first expand the General section.

It will allow you to set a starting number, ending number, prefix, suffix, and animation duration. For example, we have set the starting number 0, ending number 500, and left prefix-suffix options blank.

Scrolling down the tab a bit will show options to set Animation Duration and Label Alignment.

You can give a name to this counter block. For example, we have named it ‘Products Sold.’

The Label Alignment option will let you whether you want to show label on top or bottom of the block.

Next, expand the Animation section. You’ll get 50+ animation effects there. Add anyone to the block you like.

In the same way, by expanding the Responsive Control section, you can hide this Counter block on any device type you want.

Style #

Go to the Styles tab. You can change the text color, background color, and label color. Do yourself the needful things.

Scrolling down the tab a bit will show you the options to change the Counter Font, Label Font, and their Appearance. Hope you can these yourself again.

Similarly, expand the Dimension Settings section. You can customize the padding, margin, and gap for elements of the block.

Explore another documentation post on how to use the Social Share block of the plugin.

Conclusion #

Thus, you can fully use the Counter block of the Ultimate Blocks plugin. But while using this block, make sure to use contrasting color and clear typography so your texts are properly readable. Besides, whenever a new milestone is achieved, or any information is changed, update the block with the latest data.