Voxel Theme Math Mods – Multiply by Number

When working with dynamic data in WordPress using the Voxel Theme, having control over how numbers are displayed can be crucial for certain tasks. One common need is converting measurements, such as switching from inches to centimetres.

This Voxel Math Mod – Multiply by Number, allows you to multiply your dynamic numeric data by a static value you set.

Imagine you have a dataset that displays product dimensions in inches, but your audience prefers metric units. With the Multiply by Number modifier, you can seamlessly convert these values by multiplying each number by 2.54 — the conversion factor from inches to centimetres.

In just a few steps, your product data will be automatically converted and displayed in the preferred measurement system, making it more accessible to a global audience.

This simple yet powerful tool opens up possibilities for automatically adjusting numeric data, whether you’re converting measurements, adjusting currency, or scaling values in any other way.

The Code: Voxel Theme Modifier: Multiply by Number

Add to your functions.php file.

add_filter( 'voxel/dynamic-tags/modifiers', function( $modifiers ) {
    class Multiply_By_Number extends \Voxel\Dynamic_Tags\Base_Modifier {

        // Label for the modifier
        public function get_label(): string {
            return 'Multiply by Number';
        }

        // Unique key for the modifier
        public function get_key(): string {
            return 'multiply_by_number';
        }

        // Define input fields for the multiplier
        public function get_arguments(): array {
            return [
                'multiplier' => [
                    'type' => \Voxel\Form_Models\Number_Model::class,
                    'label' => _x( 'Multiplier', 'modifiers', 'voxel-backend' ),
                    'description' => 'Enter the value to multiply by.',
                    'classes' => 'x-col-12',
                ],
            ];
        }

        // Apply the multiplication
        public function apply( $value, $args, $group ) {
            // Ensure the value is numeric
            if ( !is_numeric( $value ) ) {
                return $value; // Return the original value if it's not numeric
            }

            // Get the multiplier, default to 1 if not provided
            $multiplier = isset( $args[0] ) ? floatval( $args[0] ) : 1;

            // Perform multiplication, allowing negative numbers and removing any upper limit
            $result = $value * $multiplier;

            // Return the result
            return $result;
        }
    }

    // Add the custom modifier to the list of available modifiers
    $modifiers['multiply_by_number'] = \Multiply_By_Number::class;
    return $modifiers;
} );

To implement this solution, you’ll need to add the code to your WordPress site. You have two options for where to place this code:

Child Theme’s functions.php File:

If you’re already using a child theme (recommended for customization), simply add the PHP code to your functions.php file. This will ensure your changes are preserved even if the main Voxel theme is updated.

Code Snippets Plugin:

If you prefer not to edit theme files directly, or if you want to manage your custom code more easily, you can use the Code Snippets plugin. This plugin allows you to add custom PHP code without touching your theme files. Just create a new snippet, paste the code, and activate it.

Then apply this Voxel Mod to any number element.