How to open downloadable products in WooCommerce in new tab

Question

I added a custom download link for my resellers to download product images. But I would like to add target="_blank" rel="noopener noreferrer" attributes to the link.

Here's my custom download link:

// Add a Custom Download File to My Account

add_filter( 'woocommerce_customer_get_downloadable_products', 'my_custom_default_download', 9999, 1 );
 
function my_custom_default_download( $downloads ) {
    
    if ( is_admin() && !defined('DOING_AJAX') )
        return;

    // Only on checkout page and logged in users
    if ( ! is_wc_endpoint_url()  || ! is_user_logged_in() )
        return;

    $wpuser_object = wp_get_current_user();
    $allowed_roles = array( 'administrator', 'default_wholesaler', 'wholesaler-non-vat-registered', 'wholesaler-ex-vat-registered', 'wholesaler-ex-non-vat-registered', 'shop_manager');

    if ( array_intersect($allowed_roles, $wpuser_object->roles) ){
   $downloads[] = array(
      'product_name' => 'Product Images (High Resolution)',
      'download_name' => 'Download',
      'download_url' => 'https://drive.google.com/drive/folders/',
   );
   return $downloads;
}
}

Here's the updated my-downloads.php file saved to my child theme:

<?php

defined( 'ABSPATH' ) || exit;

$downloads = WC()->customer->get_downloadable_products();

if ( $downloads ) : ?>

    <?php do_action( 'woocommerce_before_available_downloads' ); ?>

    <h2><?php echo apply_filters( 'woocommerce_my_account_my_downloads_title', esc_html__( 'Available downloads', 'woocommerce' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></h2>

    <ul class="woocommerce-Downloads digital-downloads">
        <?php foreach ( $downloads as $download ) : ?>
            <li>
                <?php
                do_action( 'woocommerce_available_download_start', $download );

                if ( is_numeric( $download['downloads_remaining'] ) ) {
                    /* translators: %s product name */
                    echo apply_filters( 'woocommerce_available_download_count', '<span class="woocommerce-Count count">' . sprintf( _n( '%s download remaining', '%s downloads remaining', $download['downloads_remaining'], 'woocommerce' ), $download['downloads_remaining'] ) . '</span> ', $download ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
                }

                echo apply_filters( 'woocommerce_available_download_link', '<a href="' . esc_url( $download['download_url'] ) . '" target="_blank" rel="noopener noreferrer">' . $download['download_name'] . '</a>', $download ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped

                do_action( 'woocommerce_available_download_end', $download );
                ?>
            </li>
        <?php endforeach; ?>
    </ul>

    <?php do_action( 'woocommerce_after_available_downloads' ); ?>

<?php endif; ?>

Answer 1

You've got to update the order-downloads.php file not the my-downloads.php file and save it to the child theme.

Here's the solution:

<?php
/**
 * Order Downloads.
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/order/order-downloads.php.
 *
 * HOWEVER, on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible, but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see     https://docs.woocommerce.com/document/template-structure/
 * @package WooCommerce\Templates
 * @version 3.3.0
 */

if ( ! defined( 'ABSPATH' ) ) {
    exit;
}
?>
<section class="woocommerce-order-downloads">
    <?php if ( isset( $show_title ) ) : ?>
        <h2 class="woocommerce-order-downloads__title"><?php esc_html_e( 'Downloads', 'woocommerce' ); ?></h2>
    <?php endif; ?>

    <table class="woocommerce-table woocommerce-table--order-downloads shop_table shop_table_responsive order_details">
        <thead>
            <tr>
                <?php foreach ( wc_get_account_downloads_columns() as $column_id => $column_name ) : ?>
                <th class="<?php echo esc_attr( $column_id ); ?>"><span class="nobr"><?php echo esc_html( $column_name ); ?></span></th>
                <?php endforeach; ?>
            </tr>
        </thead>

        <?php foreach ( $downloads as $download ) : ?>
            <tr>
                <?php foreach ( wc_get_account_downloads_columns() as $column_id => $column_name ) : ?>
                    <td class="<?php echo esc_attr( $column_id ); ?>" data-title="<?php echo esc_attr( $column_name ); ?>">
                        <?php
                        if ( has_action( 'woocommerce_account_downloads_column_' . $column_id ) ) {
                            do_action( 'woocommerce_account_downloads_column_' . $column_id, $download );
                        } else {
                            switch ( $column_id ) {
                                case 'download-product':
                                    if ( $download['product_url'] ) {
                                        echo '<a href="' . esc_url( $download['product_url'] ) . '">' . esc_html( $download['product_name'] ) . '</a>';
                                    } else {
                                        echo esc_html( $download['product_name'] );
                                    }
                                    break;
                                case 'download-file':
                                    echo '<a href="' . esc_url( $download['download_url'] ) . '" target="_blank" rel="noopener noreferrer" class="woocommerce-MyAccount-downloads-file button alt">' . esc_html( $download['download_name'] ) . '</a>';
                                    break;
                                case 'download-remaining':
                                    echo is_numeric( $download['downloads_remaining'] ) ? esc_html( $download['downloads_remaining'] ) : esc_html__( '&infin;', 'woocommerce' );
                                    break;
                                case 'download-expires':
                                    if ( ! empty( $download['access_expires'] ) ) {
                                        echo '<time datetime="' . esc_attr( date( 'Y-m-d', strtotime( $download['access_expires'] ) ) ) . '" title="' . esc_attr( strtotime( $download['access_expires'] ) ) . '">' . esc_html( date_i18n( get_option( 'date_format' ), strtotime( $download['access_expires'] ) ) ) . '</time>';
                                    } else {
                                        esc_html_e( 'Never', 'woocommerce' );
                                    }
                                    break;
                            }
                        }
                        ?>
                    </td>
                <?php endforeach; ?>
            </tr>
        <?php endforeach; ?>
    </table>
</section>