Back to Community

Fixing Textarea Line Breaks Not Rendering on WooCommerce Thank You Page

Content

If you're using the Checkout Field Editor (Checkout Manager) for WooCommerce plugin and notice that line breaks in your custom textarea fields are displaying as literal <br> tags instead of actual line breaks on the order thank you page, you're not alone. This is a common formatting issue that can make order details look unprofessional.

Why This Happens

This typically occurs because the textarea field content is being output using a standard escaping function that converts HTML characters to their entity equivalents (e.g., < becomes &lt;). This is a security measure to prevent code injection, but it also prevents legitimate line breaks from rendering properly.

How to Fix It

There are two primary approaches to resolve this issue:

Solution 1: Use the wpautop() Function (Recommended)

The most straightforward method is to apply WordPress's wpautop() function to the field value before output. This function automatically converts double line breaks into HTML paragraph tags (<p>) and single line breaks into <br> tags.

You would need to add custom code to your theme's functions.php file or a custom plugin. First, retrieve the field value using the order ID and field name, then apply the formatting:

$order_id = 123; // Get the actual order ID
$field_name = 'your_custom_field_slug'; // Replace with your field's meta key
$field_value = get_post_meta( $order_id, $field_name, true );

// Apply formatting to convert line breaks
$formatted_value = wpautop( $field_value );

echo $formatted_value; // Output the formatted value

Solution 2: Apply the nl2br() Function

If you prefer to only convert line breaks to <br> tags without adding paragraph tags, you can use PHP's nl2br() function instead:

$order_id = 123;
$field_name = 'your_custom_field_slug';
$field_value = get_post_meta( $order_id, $field_name, true );

// Convert new lines to <br> tags only
$formatted_value = nl2br( $field_value );

echo $formatted_value;

Important Considerations

  • Security: Both wpautop() and nl2br() are generally safe as they don't execute HTML. However, if your field allows other HTML tags, you might need additional sanitization.
  • Theme Compatibility: This solution assumes your thank you page uses standard WooCommerce hooks. If you're using a custom thank you page plugin, ensure it supports these hooks.
  • Field Identification: You'll need to know the exact meta key (name) of your custom field, which you can find in the plugin's field settings.

By implementing either of these solutions, the line breaks in your textarea fields should render correctly on the thank you page, improving the presentation of your order confirmation details.