The Avada theme by Theme Fusion has a sales pitch: “Our #1 priority is you, the user. We believe in our product and hold ourselves to the highest standards. We truly care about your site as much as you do, which is why we offer amazing support at our dedicated support center. In addition, we offer free updates with new features requested by our users. You can count on us.”
Nevertheless, there’s a feature request that they won’t implement, and funnily enough it’s to do with counting: the possibility to add a thousands separator to the values appearing in Fusion’s counter boxes.
“We don’t have an option in the shortcode for this. I tried coming up with some code that’ll help with this but no luck as it’s taking too long – we can assist with minor tweaks only. Sorry.”
Tech support does go on to provide some hints as to how this feature should be implemented, but that’s where things go wrong. They point developers to a PHP file:
“You’ll have to modify the core shortcodes.php file in your wp-content -> plugins -> fusion-core folder. in shortcodes.php there, search for the line “function shortcode_counter_box” without quotes, it should take you the start of the block of code that you need to modify.”
In the file
/themes/adava/js/main.js, you’ll find the following code (lines 846-856 in my version):
The key bit we’re interested in is this line:
(This is the line for counting down. There’s one for counting up, too. You should change that also if you use that feature.)
This code uses a 3rd-party plugin for jQuery named “jQuery-countTo”, which can be found on GitHub. The plugin documentation tells us that the countTo method takes an options object (which in the code above has members
speed). There’s an additional option we can provide, which is
formatter. This is a function with two arguments:
value (the numeric value to display) and
options, which we won’t need. The function is responsible for converting the value to a string.
In order to convert to a string with decimal separators, we can use a lovely regular expression (found on StackOverflow):
… and voilá, your animated numbers now contain thousands separators.
Now if only Theme Fusion would turn this into a little checkbox in their FusionBuilder.