Animated Number Counter
In previous articles, we wrote How to link social media with a website in Webnode? and How to add Google reviews in Webnode? In this tutorial, we will focus on another widget from Elfsight which will help you display numbers and statistics on your website. A big advantage of Elfsight is the possibility of integration of their widgets with various online editors (Webnode, Weebly, WordPress…).
The animated number counter will allow you to share successes in the form of statistics and numbers, thus you are able to directly influence the opinion and strengthen the trust of your customers in your company. The responsive number counter has a modern design and a high degree of personalization. With this service, you will charm your website visitors, get more potential customers, and improve the overall design of your website.
Let’s go!
Number Counter widget which we describe in this tutorial is for free. The external service Elfsight offers in its free version (LITE) the possibility to create 1 widget.
If you need another widget, it is necessary to purchase one of the Premium tariffs offered by this service.
The price starts at 6-10 USD / month. True, you will often come across various actions, which will reduce the cost of the service.
Number Counter – templates
The Elfsight external service allows you to choose a template for the Number Counter widget, thereby speeding up the whole process. You can currently choose from up to 22 responsive templates, for example:
-
-
- Number Counter – White Theme
- Number Counter – Black Theme
- Number Counter – Multicolor Counters
- Number Counter – Success in Numbers
- Number Counter – Dark Single Counter
- …
-
All these templates can be edited and personalized.
How to add Number Counter to website?
1. Go to the official site https://elfsight.com/, open the Widgets tab and select the Number Counter option.
2. Choose one of the 22 available templates (you can see a preview on the right side) and click the Continue with this template button.
*For the purposes of this guide, we selected the “Cleaning” template
3. In the first step, in the Content section, you can rename the entire widget and change, add or remove elements of the given counter.
You can rename the widget by clicking in the Widget Title field.
You can change/set, duplicate and delete a counter element by clicking on the three dots and selecting Edit, Duplicate or Delete.
You can add an element by clicking on Add Counter.
Under the settings of the widget element, you can, for example, modify the initial and final value of the element, rename the element or add/replace an icon.
4. In the Layout section, you can set Number of Columns or Space Between Counters. These settings are available for desktop as well as mobile version. You can set the layout of individual widget elements using Counter Elements Layout.
5. The Style section offers you the possibility of wider personalization by setting the background or font and icon.
6. If you are done with the modifications, click on Add to website for free.
The service will ask you to log in. You can use your existing Google or Facebook account or log in with your email.
7. Click the Publish button in the upper right corner and copy the necessary HTML code using Copy Code.
8. Log into the Webnode editor and enter the code according to the services you have purchased in Webnode:
1. I have purchased LIMITED, MINI, STANDARD, PROFI or BUSINESS premium plan in Webnode
If you have purchased Premium plan Limited and above from Webnode, you can insert the code of your widget (Number Counter widget) anywhere on your website.
Click the “+” button and select the “HTML” option.
add content – HTML
2. I have a FREE version in Webnode
Sorry, but in the Free version, Webnode editor does not allow adding HTML codes. It is necessary to purchase one of the plans – Limited, Mini, Standard, Profi or Business.
upragde your plan
9. Done – after inserting the code, just publish the changes with the Publish button in the top bar. You will see the Social Feed widget in the published version of your website.
Number Counter – preview
A preview of the widget in the editor (left) and in the published version of the page (right).
A few words at the end
The number counter from Elfisight is a fast and effective way to display numbers and statistics related to your business. Improve confidence in your business and brand by using the animated Number Counter that offers a wide range of personalization.
The animated Number Counter is easy to use and requires no technical skills.
Don’t hesitate and try it now!
TIP: You haven`t created your own website in Webnode yet? Get a discount of up to 17% on a new website. Click this link to get the discount.
Number Counter – FAQ
Do I need technical knowledge to add an Elfsight widget to my website?
No, you don’t need technical knowledge at all. Read this tutorial and you’ll definitely be able to do it! Fingers crossed!
Do I have to enter a payment card number?
No – the Elfsight service does not require a payment card to be filled in when using the Free (LITE) version.
More awesome tutorials
Webnode hlási: Počet nových e-shopov na Slovensku počas roku 2020 narástol v tisíckach
V roku 2020 na Slovensku pribudli tisícky nových e-shopov vytvorených cez WebnodePosledný rok všetkým dokázal, že fungovanie v online svete je v dnešnej dobe už viac než nevyhnutné. Či už podnikáte lokálne, alebo na globálnom trhu, tak je nesmierne dôležité, či máte...
Aký bol rok 2020 v spoločnosti Webnode.sk?
Webnode hlási viac než 50 000 hodín odpracovaných v roku 2020V minulosti bolo k založeniu vlastnej internetovej stránky nutné ovládať aspoň základné technické znalosti či pomoc programátora. A práve tento fakt mnoho ľudí od tvorby vlastného webu odradil. ...
