如何在WooCommerce订单页面快速查看中显示结账自定义字段

Got it, let's get that custom shipping phone field showing up in the order quick view. Here's what you need to do step by step:

1. First, ensure the field data is saved to the order #

You've already added the checkout field, but WooCommerce doesn't automatically save custom field values to order metadata. Add this code to store the shipping phone with the order:

// Save custom shipping phone to order meta
add_action( 'woocommerce_checkout_update_order_meta', 'save_custom_shipping_phone_field' );
function save_custom_shipping_phone_field( $order_id ) {
    if ( ! empty( $_POST['shipping_phone'] ) ) {
        update_post_meta( $order_id, '_shipping_phone', sanitize_text_field( $_POST['shipping_phone'] ) );
    }
}

2. Add the field to the order quick view #

Depending on which "quick view" you're referring to (admin backend or frontend user account), use the appropriate snippet below:

For Admin Order List Quick View (the popup when clicking "Quick View" in WP Admin > Orders)

This hooks into the admin preview template to insert your shipping phone:

// Display shipping phone in admin order quick view
add_action( 'woocommerce_admin_order_preview_end', 'add_shipping_phone_to_admin_quick_view' );
function add_shipping_phone_to_admin_quick_view() {
    $shipping_phone = get_post_meta( get_the_ID(), '_shipping_phone', true );
    if ( empty( $shipping_phone ) ) return;
    ?>
    <div class="wc-order-preview-shipping-phone" style="margin-top: 10px; padding-top: 10px; border-top: 1px solid #eee;">
        <strong><?php esc_html_e( 'Shipping Phone:', 'woocommerce' ); ?></strong>
        <?php echo esc_html( $shipping_phone ); ?>
    </div>
    <?php
}

For Frontend My Account Order Quick View/Details

If you want customers to see the shipping phone in their order view (either the quick view popup or full order details), use this:

// Display shipping phone in frontend order view
add_action( 'woocommerce_order_details_after_shipping_address', 'add_shipping_phone_to_frontend_order_view' );
function add_shipping_phone_to_frontend_order_view( $order ) {
    $shipping_phone = get_post_meta( $order->get_id(), '_shipping_phone', true );
    if ( ! empty( $shipping_phone ) ) {
        echo '<p><strong>' . esc_html__( 'Shipping Phone:', 'woocommerce' ) . '</strong> ' . esc_html( $shipping_phone ) . '</p>';
    }
}

Where to add this code? #

Paste all relevant snippets into your theme's functions.php file (preferably a child theme to avoid losing changes on theme updates), or use a custom plugin snippet manager.

Just double-check that the field key shipping_phone matches what you used in your original checkout field code—since your code uses $fields['shipping']['shipping_phone'], this should line up perfectly.

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