Overview of the Advanced Counter module

This page shows you how to add the Advanced Counter module to your page and explains every setting in its Content, Design and Advanced tabs, with screenshots. The Advanced Counter module shows an animated number with a title and description, such as happy clients, projects done or ratings, and the number counts up when visitors scroll to it. For more details, view the demo.

How to add the Advanced Counter module to your page

1. Open your page in the Divi Visual Builder.
2. Click the gray (+) icon inside a row to add a new module.
3. Search for DP Advanced Counter in the module search box.
4. Click the module to insert it. Its settings open on the right.

Content tab settings

The Content tab holds the module’s own settings, grouped in the toggles below. Link, Background and Element Label are the standard Divi options.

Content

• Layout: Select the layout for the advanced counter.
• Title: Enter the title for counter.
• Counter Number: Enter the number which will be animated on counter.
• Description: Define the content which will appear in the counter.

Display

• Use Icon: Choose whether or not use the icon instead of image.
• Image: Upload the image to display with the counter.
• Image ALT Text: Enter the ALT text for counter image.

Design tab settings

The Design tab lets you style each part of the module:

• Title: styling options for the title.
• Number: styling options for the number.
• Description: styling options for the description.
• Image: styling options for the image.
• Sizing, Spacing, Border, Box Shadow, Transform, Animation: the standard Divi design options for the whole module.

Advanced tab settings

The Advanced tab has the standard Divi options: Attributes (add a CSS class or ID), CSS, HTML, Conditions, Interactions, Visibility, Transitions, Position and Scroll Effects.