In this documentation, we will discuss the customization of the Advanced Counter widget, brought to you by the Element Pack Pro addon.
Inserting the Advanced Counter widget
On the page in Elementor editor, search by the widget’s name and then drag-drop it on the page.
Content tab customizations
Go to Content > Layout
Find the Show Icon/Image, Icon Type (icon & image), and Icon field options.
Also, find the Counter Start Number, Counter End Number, Separator, Counter Text, Text HTML Tag, Text Inline, Icon Position, Alignment, and Offset options.
Additional Options section
Go to Content > Additional Options
Find the Language type, Decimal Symbol, Decimal Places, Duration, Use Easing, Use Grouping, Prefix, Suffix, and Indicator options.
In the Language field, you have to specify the 10 decimal numbers in your language to show the counter text in your way.
Style tab customizations
Go to Style > Icon/Image
First, find the Icon Color, Background Type, and Color options in Normal mode.
Then find the Padding, Border Type, border Radius, Advanced Radius, Box Shadow, Typography, Spacing, icon Size, Rotate, and Background Rotate options.
Also find the Icon Color, Background Type, Effect (none, effect A, B, C, D, & E), Radius, Box Shadow, Rotate, and Background Rotate options in Hover mode.
Counter Number section
Go to Style > Counter Number
Find the Spacing, Margin, counter Color, and Typograhpy options here in Normal mode.
In Hover Mode, find the counter Color and Typography options.
Counter Text section
Go to Style > Counter Text
Find the Color, Margin, and Typography options in Normal mode.
In Hover mode, find the Color and Typography options.
Go to Style > Separator
Find the Separator Type (Line, Bloomstar, Bobbleaf, Demaxa, Fill Circle, Finalio, Jemik, Leaf Line, Multinus, Rotate Box, Sarator, Separk, Slash Line, Tripline, Vague, Zigzag Dot, & Zozobe), Separator Style (Solid, Dotted, Dashed, & Groove), Fill Color, Stroke Color, Width, and Separator Spacing options.
Go to Style > Additional
Find the Content Inner Padding option.
All done! You have successfully customized the Advanced Counter widget on your website.
You can watch the quick video to learn about the Advanced Counter widget. Please visit the demo page for examples.
Thanks for being with us.