如何在WordPress文章元数据中用wp_editor()替换textarea？

1. 替换textarea为wp_editor #

把原来的textarea代码替换为wp_editor()函数调用，注意编辑器ID和表单name必须一致，确保提交数据能正常识别：

<?php
// 获取已保存的自定义字段值
$product_desc = get_post_meta($post->ID, 'product_description', true);

// 渲染wp_editor编辑器
wp_editor(
    $product_desc,
    'product_description', // 编辑器唯一ID，需与textarea_name一致
    array(
        'textarea_name' => 'product_description', // 表单提交的name属性
        'textarea_rows' => 10, // 编辑器默认行数，可按需调整
        'media_buttons' => false, // 是否显示媒体上传按钮，按需开启
        'tinymce' => array(
            'toolbar1' => 'bold,italic,underline,link,unlink,undo,redo', // 自定义工具栏按钮
            'toolbar2' => '', // 取消第二行工具栏
        ),
        'quicktags' => true, // 是否显示HTML快速标签按钮
        'wpautop' => true // 是否自动添加<p>标签，默认开启
    )
);
?>

2. 修改保存逻辑（关键！） #

原来的sanitize_text_field()会过滤所有HTML标签，导致富文本内容丢失，必须替换为适合富文本的安全过滤函数：

if ( isset( $_POST[ 'product_description' ] ) ) {
    // 先去除WordPress自动添加的斜杠，再用wp_kses_post保留合法HTML标签
    $sanitized_desc = wp_kses_post( wp_unslash( $_POST['product_description'] ) );
    update_post_meta( $post_id, 'product_description', $sanitized_desc );
}

额外说明 #

如果需要自定义允许的HTML标签（比如添加<h3>、<blockquote>等），可以替换wp_kses_post为自定义规则：

$allowed_html = array(
    'p' => array(),
    'strong' => array(),
    'em' => array(),
    'a' => array(
        'href' => array(),
        'title' => array()
    ),
    'h3' => array(),
    'blockquote' => array()
);
$sanitized_desc = wp_kses( wp_unslash( $_POST['product_description'] ), $allowed_html );

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