CODEWITHSUNDEEP
wordpresswoocommerce
Mohamed Newer
Mohamed Newer

Reputation: 5

WooCommerce add product image in my account order details

i want to add a new column called image to myaccount-> orders -> view order in the orders details table which displays the product image for the corresponding product item in the table like this expected result

what i have tried

    function display_remove_order_item_button( $item_id, $item, $order ){
    // Avoiding displaying buttons on email notification
    if( ! ( is_wc_endpoint_url( 'view-order' ) || is_wc_endpoint_url( 'order-received' ) ) )
        return;
        $order_id = 569;
        $order = wc_get_order( $order_id );
        $product = apply_filters( 'woocommerce_order_item_product', $order->get_product_from_item( $item ), $item );
        echo $product->get_image();
        
}
add_action( 'woocommerce_order_details_before_order_table', 'nolo_custom_field_display_cust_order_meta', 10, 1 );

but the image appears inside the product column how can i achive the function in the picture ?

Upvotes: 0

Views: 3453

Answers (2)

IncipientInfo
IncipientInfo

Reputation: 533

For that you will need to edit following templates:

templates/order/order-details.php & templates/order/order-details-item.php

First copy both templates in your active theme folder and add this lines <th class="woocommerce-table__product-image product-image"><?php _e( 'Image', 'woocommerce' ); ?></th> in order-details.php and <td class="woocommerce-table__product-image product-image"><?php echo $product->get_image('thumbnail'); ?></td> in order-details-item.php. If you need a reference of function get_image check this : https://docs.woocommerce.com/wc-apidocs/class-WC_Product.html

order-details.php

<thead>
    <tr>
        <th class="woocommerce-table__product-name product-name"><?php _e( 'Product', 'woocommerce' ); ?></th>
        <th class="woocommerce-table__product-image product-image"><?php _e( 'Image', 'woocommerce' ); ?></th>
        <th class="woocommerce-table__product-table product-total"><?php _e( 'Total', 'woocommerce' ); ?></th>
    </tr>
</thead>

order-details-item.php

<td class="woocommerce-table__product-name product-name"></td>
<td class="woocommerce-table__product-image product-image"><?php echo $product->get_image('thumbnail'); ?></td>

<td class="woocommerce-table__product-total product-total">
    <?php echo $order->get_formatted_line_subtotal($item); ?>
</td>

Upvotes: 2

itzmekhokan
itzmekhokan

Reputation: 2768

Currently there is no such a hooks / filters to achieved your modifications as per your images. But it can be possible by overridden woocommerce follows templates -

Override "order-details.php" template by copying it to yourtheme/woocommerce/order/order-details.php to add your "Image" header.

Override "order-details-item.php" template by copying it to yourtheme/woocommerce/order/order-details-item.php to add your "Image" to display.

Upvotes: 0

Related Questions