在 WooCommerce 中编辑我的帐户订单视图页面

Question

In WooCommerce My account "Order view" pages, I'm supposed to add a visual tracking like this:

On actual pages, to track every order, above order details:

1. 1st problem is i don't know how to add html & php code to the view order page i tried adding hooks on functions.php but it didn't work

2. 2nd problem is that i want to get the status of every order in view order page (Ex: processing or delivered etc.)

Here is my functions.php code to try to achieve it:

    // **
//  * Add custom tracking code to the view order page
//  */
add_action( 'woocommerce_view_order', 'my_custom_tracking' );
function my_custom_tracking(){
    $order = wc_get_order( $order_id );

    $order_id  = $order->get_id(); // Get the order ID
    $parent_id = $order->get_parent_id(); // Get the parent order ID (for subscriptions…)

    $user_id   = $order->get_user_id(); // Get the costumer ID
    $user      = $order->get_user(); // Get the WP_User object

    echo $order_status  = $order->get_status(); // Get the order status 
}

Answer 1

There are some errors in your code:

1. The $order_id variable is already included as a function argument for this hook, but is missing in your code .
2. You can't use echo with $order_status = $order->get_status();

So try instead:

add_action( 'woocommerce_view_order', 'my_custom_tracking' );
function my_custom_tracking( $order_id ){
    // Get an instance of the `WC_Order` Object
    $order = wc_get_order( $order_id );
    
    // Get the order number
    $order_number  = $order->get_order_number();
    
    // Get the formatted order date created
    $date_created  = wc_format_datetime( $order->get_date_created() );
    
    // Get the order status name
    $status_name  = wc_get_order_status_name( $order->get_status() );
    
    // Display the order status 
    echo '<p>' . __("Order Status:") . ' ' . $status_name . '</p>';
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

---

If you want to change the yellow underline texts in your 2nd screenshot, you will have to make changes in myaccount/view-order.php template file:

1. First read official documentation to understand "how to Override templates via a theme" .

2. Once done and once copied WooCommerce templates to your active theme as explained on the documentation, open edit myaccount/view-order.php template file.

3. The changes to make are located in lines from 26 to 34:

    <p><?php /* translators: 1: order number 2: order date 3: order status */ printf( __( 'Order #%1$s was placed on %2$s and is currently %3$s.', 'woocommerce' ), '<mark class="order-number">' . $order->get_order_number() . '</mark>', '<mark class="order-date">' . wc_format_datetime( $order->get_date_created() ) . '</mark>', '<mark class="order-status">' . wc_get_order_status_name( $order->get_status() ) . '</mark>' ); ?></p>