In this the final instalment of the SiteOrigin Widgets plugin by CodeLights, I will show you the Stats Counter component of this plugin. The Stats Counter is a great way to draw visitors attention to stats that are expressed as numbers. All you need to do is set the style and set the starting and ending numbers, it couldn’t be easier.
Some notable features of this component include:
- 6 international number formats including Chinese and Indian
- Negative numbers can be framed with parentheses
- Decimal points can be specified or left off completely
The Examples
If you’d like to see the official examples, head over to codelights.com and check out the demos there.
How To
Before we get started, I must just point out that this plugin can’t be configured from the Divi Visual Builder but only in the classic back-end. That said, once you’ve installed the plugin, head over to the page you want to use it on and click on the module you want to use it in. I’ve only tested it in the regular Divi Text Module, but it should work wherever you have a text editor.
Now that the plugin is installed, you’ll see a new icon in the text editor’s toolbar:
Click on this icon and choose Stats Counter from the six options. This will open the following window:
The configuration is relatively straightforward, the only thing that might not be obvious is that you can insert a phrase with an initial value in the Initial Counter value field and then the same phrase in the Final Counter value field with the final value.
The End
And that’s it! The final instalment of this series on the SiteOrigin Widgets by CodeLights. Do yourself a favour and check out the other posts on this plugin:
- The Flipbox module
- The Interactive Text module (i.e. Hover Effects)
- The Modal Pop module
- The Interactive Text module (i.e. typing effect)
- The Testimonial module
If you’re looking for more information on the finer details of configuring the stats counter, check out the article, All Eyes on Counters.
Photo by Carlos Muza on Unsplash
Divi Notes started as a way to document my own WordPress and Divi web design/development journey and, to my delight, has grown to become a helpful resource to many other Divi users out there. If you’ve found Divi Notes to be useful in your journey, I’d appreciate it if you would consider supporting me using the form below.