Skip to content
StoreDocsSupport
Get Divi Torque

Animated Counter

The Animated Counter module shows a number with a title underneath, such as "250" and "Projects completed". Turn on Use Counter to make the number count up. You can show the number in a box or place it freely over the module.

How to add the Animated Counter module

  • Add a section and a row, then add the Animated Counter module.
  • Enter the Number and the Title.
  • Turn on Use Counter if you want the number to count up.

Content

Under Content > Content:

  • Number: the number to show.
  • Title: the text shown with the number.
  • Use Counter: counts the number up to its value. Off by default. The count starts when the page loads and takes about 5 seconds. Visitors whose device is set to reduce motion see the final number with no animation.
  • Number Position: Default puts the number above the title. Absolute lets you place the number with the offsets under Design > Number.

Design

Number

  • Alignment: Left, Center or Right. Default is Left.
  • Use Number Box: shows the number inside a box. On by default. The box has a light gray background by default.
  • Height and Width: the size of the number box. Default is 100px each. They apply only when Use Number Box is on.
  • Rotate: turns the box. The number text stays upright. Default is 0deg.
  • Number Position: Left Top, Left Bottom, Right Top or Right Bottom. Applies only when Number Position under Content is Absolute.
  • Use Horizontal Position Center and Use Vertical Position Center: center the number on that axis.
  • Horizontal Offset and Vertical Offset: the distance from the chosen corner. Default is 50px each.

Number Text

Font options for the number.

Title Text

Font options for the title.

  • Title Spacing Top: the space above the title. Default is 10px. Applies only when Number Position under Content is Default.