With the AI Counter addon, you can showcase various numerical data in an engaging and visually appealing manner. It is often used to highlight statistics or any numerical information you want to emphasize. The addon typically provides customization options for ending numbers, Layout formats, duration, and styling it.
How to set up the AI Counter:
Step 1: Search and find Counter in the search box under the Elements Tab. After that, easily drag and drop the widget wherever you want inside the Elementor section.
Step 2: This is how the element will look after inserting the AI Counter addon.
How to set up content for AI Counter?
Under the content tab, you will be able to configure the AI Counter section.
Counter: Set Counter Title, Value, Suffix and duration.
Layouts: You can simply drag and drop the Elements to arrange them in a particular sequence, such as what should come first and second, or you can deactivate a particular element in the section by dragging from the Visible to dropping in Disable section. You can also customize it by adjusting its alignment, Layout, and Heading Tag.
Icon: From this section, you can choose Icon from Icon Library or SVG Image. Besides you can set the View in the dropdown.
Image: You can select the image from Media Library or Insert it from the URL. Additionally, you can modify the image’s size using the drop-down menu.
Content: Write strong content here.
How to add Styles to the Counter?
Under the Style Tab, each element of the Counter can be individually customized. Alter Padding, Margin, Border Type, and Border Radius. Additionally set Font Colour, Background Colour, and Box Shadow for both Normal and Hover Mode under the General Section.
Title: In both normal and hover modes, you can separately change the title’s colour, padding, margin, transform, spacing, and typography.
Counter: Set the colour to the counter value and modify the typography, padding, and margin in the normal and hover modes.
Icon: Icon: In this section, you have the option to change the icon’s size, colour, rotation, and outer margin in both hovering and normal modes. Furthermore, you may choose any animation effect for the icon while it is in hover mode.
Image: You may separately change the Background Colour, Image Style, Spacing, Padding, and Border Type for the Normal and Hover Mode.
Content: Set Description Spacing and Typography to the content.
