How To Use The Total Count Widget By Atomic Addons

The Total Count widget by Atomic Addons shows a number your site counts for you: how many comments, users or published posts it has. The number counts up when the widget scrolls into view, with a label such as “Happy Members” under it and an optional icon. You never type the number: it updates by itself as your site grows. This guide covers adding the widget, choosing what it counts and the counter settings.

Enable the Total Count Widget

Total Count is a Free widget and works with the free Atomic Addons plugin. Switch it on from the plugin dashboard:

1. 1

   Go to WordPress Dashboard → Atomic Addons.

2. 2

   Click the Widgets tab.

3. 3

   Search for Total Count. You can also open the Content category.

4. 4

   Turn the Total Count widget on.

5. 5

   Click Save Settings.

Add the Total Count Widget

1. 1

   Open the page in Elementor (Edit with Elementor).

2. 2

   In the widget panel, search for Total Count. The widget sits in the Atomic Addons category.

3. 3

   Drag it into the page and set it up with the controls below.

4. 4

   Click Publish (or Update).

Count Layout

Content → Count Layout chooses what is counted and how the widget looks:

1. 1

   Total Count For: Comment (the default), User or Post.

2. 2

   Comment Count Type: With Comment: which comments count. Total Comment (the default), Total Moderated (waiting for approval), Total Approved, Total Spam or Total trashed.

3. 3

   Specific Post Type: With Post: which post type to count, Posts by default, or for example Pages or Products. Only published items count.

4. 4

   Select User Type: With User: All Users (the default) or one role, such as Subscriber or Editor.

5. 5

   Show Icon / Image: Adds an icon or image to the counter. Off by default.

6. 6

   Icon Type: With the icon on: Icon (the default, a star) or Image. Pick the icon under Icon, or the picture under Image Icon.

7. 7

   Count Start Number: The number the animation starts from, 0 by default.

8. 8

   Fake Addition: A number added to the real count, 0 by default. For example, a site with 340 users and a Fake Addition of 1000 shows 1340.

9. 9

   Separator: Adds a short line between the number and the text.

10. 10

    Count Text: The label under the number, “Total Count” by default. Leave it empty for no label.

11. 11

    Text HTML Tag: The label's markup: H1 to H6, div, span or p. H4 by default.

12. 12

    Icon Position: With the icon on: Top (the default), Left or Right of the number and text.

13. 13

    Icon Inline: With Left or Right: puts the icon on the same line as the number only, with the text below both.

14. 14

    Icon Vertical Alignment: With Left or Right and Icon Inline off: lines the icon up with the Top (the default), Middle or Bottom of the content.

15. 15

    Alignment: Left, center, right or justified, per screen size.

16. 16

    Offset: With the icon on: click the pencil and choose Custom to move the icon with Horizontal Offset and Vertical Offset, per screen size.

Additional Options

Content → Additional Options sets up how the number is written and animated:

1. 1

   Language: The ten digits 0 to 9, separated by commas: 0,1,2,3,4,5,6,7,8,9 by default. Replace them with another script's digits, such as ٠,١,٢,٣,٤,٥,٦,٧,٨,٩, to show the count in that script.

2. 2

   Decimal Symbol: The decimal mark, a period by default.

3. 3

   Decimal places: How many digits follow the decimal mark, 0 by default.

4. 4

   Duration: How long the count-up takes, in seconds: 2 by default.

5. 5

   Use Easing: Slows the count down as it reaches the end. On by default.

6. 6

   Use Grouping: Splits long numbers into groups of three, such as 12,500. Off by default. Separator Symbol sets the group mark, a comma by default.

7. 7

   Prefix: Text before the number, such as “+” or “$”.

8. 8

   Suffix: Text after the number, such as “+” or “k”.

The count is worked out each time the page is built, so it is always current. The final number is in the page from the start, and the count-up runs once when the widget is mostly in view.

Style the Total Count

Everything below is on the Style tab. Sections that belong to a part you turned off are hidden.

• Icon/Image — the icon's color, background, size, padding, border, radius and rotation, or the image's width and effects, with a Hover state.
• Count Number — spacing, color and typography, with a Hover state.
• Count Text — color and typography, with a Hover state.
• Separator — the line's style, color, height, width and spacing.
• Additional — Content Inner Padding, plus the spacing and gap of an inline icon.