Counter Block

We have brought up this article about how you can easily create a counter using Spectra.

Many websites on the internet sell the same product or service as yours. To make your website distinguishable, a counter block adds a cheery as it directly tells your new customer about the satisfactory service experienced by your past customers.

This article lets you know how you can easily create a counter section. But before that, let’s see what a counter is and why we use them.

What Is a Counter on a Website?

A counter is usually at the end of the website page that your new users about the credibility of your business. When a user sees a counter, it helps decide whether to use your product/ service or not.

How to add a Counter Block using Spectra?

To insert the Counter block, click the Toggle block inserter + icon and search for the Counter block.

General Settings

Counter block animates a number up to a particular value and has visual elements like a progress bar. Under the General Settings tab, you can set the:

• Layout to Number/ Circle/ Bar.
• Starting and ending numbers.
• Animation Duration.
• Enable the Image/ Icon

Style Options

• Under the style tab, you can see the typography, color, and margin options for Numbers and Headline.
• You can set the Circle size, stroke size, and Progress Color.
• You can set the Image/ Icon color when it is normal and hovered.
• Also, you can set the Border around the icon or image.