Woocommerce Question posted in
The official Woocommerce documentation can be found here.

Display product image on Woocommerce My Account Downloads section

I’ve got a problem that I can’t seem to figure out. I’m trying to add the product image to each item in the my-account/downloads/ section. I have tried multiple codes that I found but none seem to work for me.

I am using 3 plugins with all other plugins disabled trying to figure this out. These 3 plugins are required, so I need this to work with all 3 of these plugins activated.

The 3 plugins are:

Woocommerce Memberships

Woocommerce Subscriptions

Woocommerce Subscriptions Downloads

All my products are virtual so I need an image next to their name in the downloads section. I’m pulling my hair out here… Anyway, to the things I’ve tried.

I have tried this code which I found in This form post

function my_account_downloads_column_download_product( $download ) {
    // Get $product object from product ID
    $product = wc_get_product( $download['product_id'] );
    
    // Get thumbnail
    $thumbnail = $product->get_image(array( 36, 36)); // Get the product thumbnail (from product object)
    
    // Image found
    if( $product->get_image_id() > 0 ) {
        $item_name = '<div class="item-thumbnail">' . $thumbnail . '</div>';
        echo $item_name;
    }

    echo '<a href="' . $product->get_permalink() . '">' . $product->get_name() . '</a>';
 }

I also tried the other codes present in that form but they didn’t work for me.

Based on Add the product image to Woocommerce my account order view answer code, which works great for the view-order page, I have made some changes trying to make it work for my-account/downloads/ section.

Here’s my code attempt:

// Display the product thumbnail in order view pages
add_filter( 'woocommerce_my_account_my_downloads_title', 'display_product_image_in_downloads', 20, 3 
    );
function display_product_image_in_downloads( $item_name, $item, $is_visible ) {
    // Targeting view order pages only
    if( is_wc_endpoint_url( 'downloads' ) ) {
        $product       = $item->get_product(); // Get the WC_Product object (from order item)
        $product_image = $product->get_image(array( 80, 80)); // Get the product thumbnail (from product 
    object)
        $item_name     = '<div class="item-thumbnail">' . $product_image . '</div>' . $item_name;
    }
    return $item_name;
}

I changed woocommerce_my_account_my_downloads_title out to every one I could find related to downloads on the Woocommerce Hook Reference page

However, none of them seem to work for me.

I tried to modify the template files by copying them to my childtheme / woocommerce / order / order-downloads.php, also childtheme / woocommerce / myaccount / downloads.php, and childtheme / woocommerce / myaccount / my-downloads.php. I couldn’t get any of that to work so I removed it from my childtheme and tried the codes above in my childthemes functions.php file.

I have scoured the internet trying to find a solution but, every one of them don’t seem to work for me. I have a feeling that Woocommerce Subscriptions Downloads could be the problem, but it’s a must plugin for me. I probably just didn’t do something right or missed something but I can’t seem to find out what.

Can someone help me figure this out? That would be awesome.

All I want is the product image next to the downloadable product. I only sell downloadable products and there are hundreds of products. An image would just help the customer find what they want to download so much easier.

Tags:

2

Answers


  1. 0

    On My Account Downloads section the related template is myaccount/downloads.php.
    This template call order/order-downloads.php to display the downloads table.

    So the right hook to be used is woocommerce_account_downloads_column_{$column_id} composite action hook, where**$column_id** is download-product to target the product name.

    Now for Woocommerce Subscriptions Downloads, I don’t know if the following will work.

    So the right code is going to be:

    // Display the product thumbnail in order view pages
add_filter( 'woocommerce_account_downloads_column_download-product', 'display_product_image_on_account_downloads' );
function display_product_image_on_account_downloads( $download ) {
    // Targeting view order pages only
    if ( ! is_wc_endpoint_url( 'downloads' ) ) return;

    if ( $download['product_id'] > 0 ) {
        $product = wc_get_product( $download['product_id'] ); // The product object
        $image   = $product->get_image( array(50, 50) ); // The product image

        if ( $download['product_url'] ) {
            echo $image . '<a href="' . esc_url( $download['product_url'] ) . '">' . esc_html( $download['product_name'] ) . '</a>';
        } else {
            echo $image . esc_html( $download['product_name'] );
        }
    }
}

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

    Login or Signup to reply.
  2. 0

    @LoicTheAztec ‘s answer works but I changed it a little bit, because:
    order-downloads.php content is also called on the order-received endpoint when a Digital product is ordered.
    So when using if ( ! is_wc_endpoint_url( 'downloads' ) ) return; – it will show the image on the /my-account/downloads page but the Product title field on the /checkout/order-received will become empty. No product title, and no image.

    So, I solved it by changing:
    if ( ! is_wc_endpoint_url( 'downloads' ) ) return;
    to
    if ( is_wc_endpoint_url( array ('downloads' , 'order-received') )) return;

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search