Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Add a custom column to My Account Orders table in Woocommerce 3+

Woocommerce 3.5.x has a special page at the user account (My Account) area where it displays the user's previous Orders.

This page is now 5 column displays as default.

Here the screenshot of the woocommerce Orders area with 5 column:

My Orders

I Can't find the way to change this.

How can I add a new column in the default?

like image 980
Dimas Anugerah Avatar asked Dec 05 '18 01:12

Dimas Anugerah


3 Answers

This requires 2 functions that will add a new column

The second function hook is a composite hook: woocommerce_my_account_my_orders_column_{$column_id} where {$column_id} need to be replaced by the column key slug that is set in the first function.

That second function manage the displayed row values and you can add for example a custom field to get custom order meta data values.

The code:

add_filter( 'woocommerce_account_orders_columns', 'add_account_orders_column', 10, 1 );
function add_account_orders_column( $columns ){
    $columns['custom-column'] = __( 'New Column', 'woocommerce' );

    return $columns;
}

add_action( 'woocommerce_my_account_my_orders_column_custom-column', 'add_account_orders_column_rows' );
function add_account_orders_column_rows( $order ) {
    // Example with a custom field
    if ( $value = $order->get_meta( '_custom_field' ) ) {
        echo esc_html( $value );
    }
}

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


You are done and have added a custom column to My account orders table:

enter image description here

If you which to make changes in the table html output, you will have to override the template file: myaccount/orders.php

like image 137
LoicTheAztec Avatar answered Oct 17 '22 00:10

LoicTheAztec


If you don't wanna change the order template under myaccount page. Here's what you have to do.

First:

function wc_add_myaccount_order_column( $columns ) {
    $columns[ 'custom-column' ] = __( 'Custom Column', 'woocommerce' );
}
add_filter( 'woocommerce_my_account_my_orders_columns', 'wc_add_myaccount_order_column' );

Second:

function wc_custom_column_display( $order ) {
    // do something here
    echo "testing";
}
add_action( 'woocommerce_my_account_my_orders_column_custom-column', 'wc_custom_column_display' );

The code above will display "testing" in each order under "Custom Column" column.

Note: If you actually wanna change the entire template, like the design for example. You can follow the first answer above.

like image 36
Carl Ortiz Avatar answered Oct 17 '22 00:10

Carl Ortiz


Just to improve the accepted answer I add a line to choose the position of the column (after total):

function sv_wc_add_my_account_orders_column( $columns ) {

    $new_columns = array();

    foreach ( $columns as $key => $name ) {

        $new_columns[ $key ] = $name;

        // add ship-to after order status column
        if ( 'order-total' === $key ) {  //this is the line!
            $new_columns['custom-column'] = __( 'Custom Column', 'woocommerce' );
        }
    }

    return $new_columns;
}
add_filter( 'woocommerce_my_account_my_orders_columns', 'sv_wc_add_my_account_orders_column' );


    function wc_custom_column_display( $order ) {
        // do something here
        echo "testing";
    }
    add_action( 'woocommerce_my_account_my_orders_column_custom-column', 'wc_custom_column_display' );
like image 35
federico sgoifo Avatar answered Oct 17 '22 00:10

federico sgoifo