Back to Community

How to Format Numbers with the Metadata Shortcode in Shortcodes Ultimate

Content

If you're using the [su_meta] shortcode from the WP Shortcodes Plugin — Shortcodes Ultimate to display a custom field value, you might find that the raw data isn't always presented in the most user-friendly format. A common issue is displaying a number like 58000.00000 without any formatting. This guide will show you how to use a custom filter to format that number to something more readable, like 58,000.00.

Why This Happens

The [su_meta] shortcode is designed to fetch and display the raw value stored in your post's metadata. It doesn't apply any formatting by default because the intended use case for the data can vary widely—it could be a number, a string of text, or a date. Therefore, the plugin outputs the value exactly as it's stored in the database, leaving any specific formatting up to the user.

The Solution: Using a Custom Filter

The most effective way to format the output of the [su_meta] shortcode is by using the built-in filter attribute. This allows you to pass the retrieved value through a custom PHP function that you define, giving you complete control over how it's displayed.

Here is a step-by-step guide based on a solution that worked for a user in the community:

  1. Modify Your Shortcode: Add the filter attribute to your existing [su_meta] shortcode. You need to provide a unique name for your custom filter function.
    [su_meta key="your_meta_key" filter="my_custom_format_filter"]
    Replace your_meta_key with the name of your custom field.
  2. Add the Custom Function: You need to add the corresponding PHP function to your theme's functions.php file. This function will receive the raw value and return the formatted string.
    function my_custom_format_filter( $value ) {
        return number_format( floatval( $value ), 2, ".", "," );
    }
    add_filter( 'su/shortcodes/meta/filter', 'my_custom_format_filter' );
    This example uses PHP's number_format() function to format the value with two decimal places, using a period for the decimal point and a comma for the thousands separator. You can adjust these parameters to match your desired format.
  3. Important Naming Rule: As noted by the plugin's author, Vladimir Anokhin, the name of your filter function must contain the word 'filter' for it to work correctly. The example above follows this rule.

Alternative Considerations

  • Child Theme: Always add custom code to a child theme's functions.php file. This prevents your changes from being lost when the parent theme is updated.
  • Testing: After adding the code, clear any caching on your site and test the page containing the shortcode to ensure the number is now formatted correctly.
  • Other Data Types: This method is not limited to numbers. You can create custom filters to format dates, append text, or manipulate the output in any way you need.

By leveraging the filter attribute, you can harness the power of the [su_meta] shortcode while ensuring the displayed data meets your specific presentation requirements.