WooCommerce自定义结算字段：显示位置调整及后台可编辑问题

我已在WooCommerce结算页面的账单地址区域添加了自定义字段，功能正常。现需实现以下需求：

• 在邮件的「账单地址」框、「我的账户」订单摘要页面中显示这些字段的值；
• 让后台订单页面的这些字段可编辑（与WooCommerce原生账单字段一致）。

当前代码能实现基础功能，但存在字段位置不合理、订单摘要未显示、后台无法编辑的问题，以下是完整解决方案：

1. 添加结算页自定义账单字段 #

使用woocommerce_billing_fields钩子（贴合账单字段体系），字段命名遵循WooCommerce原生billing_前缀，确保兼容性：

add_filter( 'woocommerce_billing_fields', 'add_custom_billing_fields' );
function add_custom_billing_fields( $fields ) {
    $fields['billing_codice_fiscale'] = array(
        'label'     => 'Codice fiscale',
        'type'      => 'text',
        'required'  => true,
        'class'     => array( 'form-row-last' ),
        'priority'  => 30,
    );

    $fields['billing_partita_iva'] = array(
        'label'     => 'Partita iva',
        'type'      => 'text',
        'required'  => false,
        'class'     => array('form-row-first'),
        'priority'  => 31,
    );

    $fields['billing_codice_univoco'] = array(
        'label'     => 'Codice Univoco',
        'type'      => 'text',
        'required'  => false,
        'class'     => array( 'form-row-last' ),
        'priority'  => 32,
    );

    return $fields;
}

2. 保存字段值到订单元数据 #

同步使用billing_前缀元键，和原生字段逻辑保持一致：

add_action( 'woocommerce_checkout_update_order_meta', 'save_custom_billing_fields_to_order' );
function save_custom_billing_fields_to_order( $order_id ) {
    $fields = array('billing_codice_fiscale', 'billing_partita_iva', 'billing_codice_univoco');
    
    foreach ( $fields as $field ) {
        if ( ! empty( $_POST[$field] ) ) {
            update_post_meta( $order_id, $field, sanitize_text_field( $_POST[$field] ) );
        }
    }
}

3. 后台订单编辑页实现可编辑字段 #

通过woocommerce_admin_billing_fields钩子将自定义字段加入原生账单字段组，自动获得原生字段的编辑样式和保存逻辑：

add_filter( 'woocommerce_admin_billing_fields', 'add_custom_billing_fields_to_admin' );
function add_custom_billing_fields_to_admin( $fields ) {
    $fields['codice_fiscale'] = array(
        'label' => 'Codice fiscale',
        'show'  => true,
    );

    $fields['partita_iva'] = array(
        'label' => 'Partita iva',
        'show'  => true,
    );

    $fields['codice_univoco'] = array(
        'label' => 'Codice Univoco',
        'show'  => true,
    );

    return $fields;
}

4. 在邮件账单地址区域显示字段 #

使用woocommerce_email_customer_details钩子，将字段插入账单地址区块内，位置更合理：

add_action( 'woocommerce_email_customer_details', 'display_custom_billing_fields_in_email', 20, 4 );
function display_custom_billing_fields_in_email( $order, $sent_to_admin, $plain_text, $email ) {
    $fields = array(
        'billing_codice_fiscale' => 'Codice fiscale',
        'billing_partita_iva' => 'Partita iva',
        'billing_codice_univoco' => 'Codice Univoco',
    );

    foreach ( $fields as $meta_key => $label ) {
        $value = $order->get_meta( $meta_key );
        if ( ! empty( $value ) ) {
            if ( $plain_text ) {
                echo "\n" . $label . ': ' . $value;
            } else {
                echo '<p><strong>' . esc_html( $label ) . ':</strong> ' . esc_html( $value ) . '</p>';
            }
        }
    }
}

5. 在我的账户订单摘要页面显示字段 #

使用woocommerce_order_details_after_billing_address钩子，将字段放在账单地址下方，符合用户浏览习惯：

add_action( 'woocommerce_order_details_after_billing_address', 'display_custom_billing_fields_in_my_account' );
function display_custom_billing_fields_in_my_account( $order ) {
    $fields = array(
        'billing_codice_fiscale' => 'Codice fiscale',
        'billing_partita_iva' => 'Partita iva',
        'billing_codice_univoco' => 'Codice Univoco',
    );

    foreach ( $fields as $meta_key => $label ) {
        $value = $order->get_meta( $meta_key );
        if ( ! empty( $value ) ) {
            echo '<p><strong>' . esc_html( $label ) . ':</strong> ' . esc_html( $value ) . '</p>';
        }
    }
}

关键说明 #

• 统一使用billing_前缀，确保和WooCommerce原生账单字段逻辑兼容，避免显示/编辑异常；
• 后台编辑功能通过官方钩子实现，无需手动构建输入框，自动继承原生样式；
• 邮件和账户页面的钩子选择确保字段出现在用户预期的位置，而非无关区域。

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