如何在WooCommerce产品属性描述中渲染HTML代码？

我希望在WordPress WooCommerce的产品属性描述中渲染HTML代码，但测试自定义插件代码后，HTML始终以纯文本形式显示在属性描述字段中。以下是我测试过的无效插件代码：

<?php
/*
Plugin Name: Custom Product Attribute Description
Description: Allows adding HTML descriptions to WooCommerce product attributes.
Version: 1.0
Author: Your Name
*/

// Adding the custom field to product attributes
add_action('woocommerce_product_after_variable_attributes', 'add_custom_attribute_description_field', 10, 3);
function add_custom_attribute_description_field($product, $loop, $variations) {
    $html_value = get_post_meta($product->get_id(), 'attribute_description', true);
    echo '<div class="form-row form-row-wide">';
    echo '<p class="form-field">';
    echo '<label for="attribute_description[' . $loop . ']">' . __('Attribute Description', 'woocommerce') . '</label>';
    echo '<textarea id="attribute_description[' . $loop . ']" name="attribute_description[' . $loop . ']" rows="5" cols="40" class="input-text">' . esc_textarea($html_value) . '</textarea>';
    echo '</p>';
    echo '</div>';
}

// Saving the custom field value
add_action('woocommerce_save_product_variation', 'save_custom_attribute_description_field', 10, 2);
function save_custom_attribute_description_field($post_id, $i) {
    if (isset($_POST['attribute_description'][$i])) {
        $allowed_html = array(
            'a' => array(
                'href' => array(),
                'title' => array(),
            ),
            'br' => array(),
            'strong' => array(),
            // Add more allowed tags as needed
        );
        $html_value = wp_kses($_POST['attribute_description'][$i], $allowed_html);
        update_post_meta($post_id, 'attribute_description', $html_value);
    }
}

// Displaying the custom attribute description
add_filter('woocommerce_display_product_attributes', 'display_html_in_product_attributes', 10, 2);
function display_html_in_product_attributes($product_attributes, $product) {
    $html_value = get_post_meta($product->get_id(), 'attribute_description', true);
    if (!empty($html_value)) {
        $product_attributes['Custom Description'] = array(
            'label' => __('Description', 'woocommerce'),
            'value' => wp_kses_post($html_value) // Output sanitized HTML
        );
    }
    return $product_attributes;
}

添加HTML到属性描述的截图：

测试HTML描述的截图：

我找到一个临时解决方案，即创建支持HTML的自定义产品标签，以下是对应插件代码：

<?php
/**
 * Plugin Name: Custom WooCommerce Tabs
 * Description: Adds custom tabs to WooCommerce products.
 * Version: 1.0
 * Author: Your Name
 */

// Exit if accessed directly
if (!defined('ABSPATH')) {
    exit;
}

// Register the custom fields in the product edit page
function cwt_add_custom_fields() {
    global $post;

    if ($post->post_type !== 'product') {
        return;
    }

    echo '<div class="options_group">';
    
    // Custom Tab Title
    woocommerce_wp_text_input([
        'id' => 'custom_tab_title',
        'label' => __('Custom Tab Title', 'txtdomain'),
        'placeholder' => 'Enter custom tab title here',
        'desc_tip' => 'true',
        'description' => __('This title will appear as the tab heading.', 'txtdomain'),
    ]);

    // Custom Tab Content
    wp_editor(get_post_meta($post->ID, 'custom_tab_content', true), 'custom_tab_content', []);
    
    echo '</div>';
}
add_action('woocommerce_product_after_attributes', 'cwt_add_custom_fields');

// Save the custom fields
function cwt_save_custom_fields($post_id) {
    $custom_tab_title = isset($_POST['custom_tab_title']) ? sanitize_text_field($_POST['custom_tab_title']) : '';
    update_post_meta($post_id, 'custom_tab_title', $custom_tab_title);

    if (isset($_POST['custom_tab_content'])) {
        update_post_meta($post_id, 'custom_tab_content', wp_kses_post($_POST['custom_tab_content']));
    }
}
add_action('woocommerce_process_product_meta', 'cwt_save_custom_fields');

// Add custom tabs to WooCommerce product pages
function cwt_add_custom_tab($tabs) {
    global $post;

    $custom_tab_title = get_post_meta($post->ID, 'custom_tab_title', true);
    $custom_tab_content = get_post_meta($post->ID, 'custom_tab_content', true);

    if (!empty($custom_tab_title)) {
        $tabs[sanitize_title($custom_tab_title)] = [
            'title' => $custom_tab_title,
            'callback' => function() use ($custom_tab_content) {
                echo $custom_tab_content;
            },
            'priority' => 10,
        ];
    }

    return $tabs;
}
add_filter('woocommerce_product_tabs', 'cwt_add_custom_tab');

添加HTML到自定义标签的截图：

渲染HTML的截图：

内容的提问来源于stack exchange，提问作者Yalenka