Skip to content
Advertisement

Add products thumbnail to Woocommerce admin orders list

I would like to add futured image on admin view order pages in Woocommerce. New Column created, but the product image does not appear. What should I do to show the order thumbnail? Thanks.

// Admin Order page new colums
add_filter( 'manage_edit-shop_order_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( 'order_received_item_thumbnail_image' ) ) {
        echo esc_html( $value );
    }
}

Advertisement

Answer

Beware, as orders can have many products (many order items) and in this cas you will have many images (also it will weigh down the page)

Now Your 2nd function hook is wrong and will not do anything.

To so you need to loop through order items as follow:

// Add a new custom column to admin order list
add_filter( 'manage_edit-shop_order_columns', 'admin_orders_list_add_column', 10, 1 );
function admin_orders_list_add_column( $columns ){
    $columns['custom_column'] = __( 'New Column', 'woocommerce' );

    return $columns;
}

// The data of the new custom column in admin order list
add_action( 'manage_shop_order_posts_custom_column' , 'admin_orders_list_column_content', 10, 2 );
function admin_orders_list_column_content( $column, $post_id ){
    global $the_order;

    if( 'custom_column' === $column ){
        $count = 0;

        // Loop through order items
        foreach( $the_order->get_items() as $item ) {
            $product = $item->get_product(); // The WC_Product Object
            $style   = $count > 0 ? ' style="padding-left:6px;"' : '';

            // Display product thumbnail
            printf( '<span%s>%s</span>', $style, $product->get_image( array( 50, 50 ) ) );

            $count++;
        }
    }
}

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

enter image description here

User contributions licensed under: CC BY-SA
7 People found this is helpful
Advertisement