为WooCommerce结账页面添加额外表单数据并存储用户元数据

Hey there! Let's get your custom WooCommerce checkout field saving data correctly. I notice you've got the field added already, but there's a small hook name mistake and some extra steps to make everything work smoothly.

First, make sure your custom field is being added to the checkout page via a valid WooCommerce hook. You can use hooks like woocommerce_checkout_billing (to place it near billing details) or woocommerce_checkout_after_order_review (to place it near the order summary). Here's a cleaned-up version of your field code with an optional "required" flag:

add_action( 'woocommerce_checkout_billing', 'add_my_custom_checkout_field' );
function add_my_custom_checkout_field( $checkout ) {
    woocommerce_form_field('myName', array( 
        'type' => 'text', 
        'class' => array('my-field-class form-row-wide'), 
        'label' => __('First Name'), 
        'placeholder' => __('Please enter your name'),
        'required' => true, // Uncomment this if you want the field to be mandatory
    ), $checkout->get_value('myName'));
}

The hook name you used is incorrect — it should be woocommerce_checkout_update_order_meta (you had an extra "field" in the name). This is why your data isn't saving to the database. Use this corrected code to store the field value as order metadata:

add_action('woocommerce_checkout_update_order_meta', 'my_custom_checkout_field_update_meta');
function my_custom_checkout_field_update_meta( $order_id ) {
    // Only save if the field isn't empty
    if ( ! empty( $_POST['myName'] ) ) {
        // Save to order meta (the underscore makes it hidden in WP admin by default)
        update_post_meta( $order_id, '_my_custom_first_name', sanitize_text_field( $_POST['myName'] ) );
    }
}

• sanitize_text_field() ensures user input is cleaned to prevent security issues like XSS attacks.
• The _ prefix on the meta key (_my_custom_first_name) hides the field from the default "Custom Fields" section in the WordPress admin (remove it if you want it visible there).

If you want to enforce that users fill out this field before checking out, add validation with the woocommerce_checkout_process hook:

add_action('woocommerce_checkout_process', 'my_custom_checkout_field_validation');
function my_custom_checkout_field_validation() {
    if ( empty( $_POST['myName'] ) ) {
        wc_add_notice( __( 'Please enter your first name to proceed.' ), 'error' );
    }
}

This will show an error message and block checkout until the field is filled.

To make the saved first name visible, add these snippets to show it in the WordPress admin order page and customer order details:

Admin Order Page #

add_action( 'woocommerce_admin_order_data_after_billing_address', 'display_custom_field_in_admin_order', 10, 1 );
function display_custom_field_in_admin_order( $order ) {
    $custom_name = get_post_meta( $order->get_id(), '_my_custom_first_name', true );
    if ( $custom_name ) {
        echo '<p><strong>'.__('Custom First Name').':</strong> ' . esc_html( $custom_name ) . '</p>';
    }
}

Customer Order Details (Confirmation & My Account) #

add_action( 'woocommerce_order_details_after_billing_address', 'display_custom_field_in_customer_order', 10, 1 );
function display_custom_field_in_customer_order( $order ) {
    $custom_name = get_post_meta( $order->get_id(), '_my_custom_first_name', true );
    if ( $custom_name ) {
        echo '<p><strong>'.__('Your First Name').':</strong> ' . esc_html( $custom_name ) . '</p>';
    }
}

Important Note #

Add all these code snippets to your active theme's functions.php file, or use a custom plugin to store them. Never edit WooCommerce core files directly — your changes will be lost when WooCommerce updates.

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