Woocommerce - External/Affiliate Product Image and title to External Link (New tab)

Question

I'm starting with programming with wordpress and woocommerce. I need help after searching for Stack.

I need the images and titles of the products of my store to point to the affiliate link without going through the single post page. And that everything opens in a new tab.

Been following this thread: Woocommerce - External/Affiliate Product Image to External Link (Buy url)

I have used the Edit # 2 code from Sadoo and it works perfectly for me.

remove_action('woocommerce_before_shop_loop_item', 'woocommerce_template_loop_product_link_open');
add_action('woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_link_open', 15);

add_action('woocommerce_before_shop_loop_item', 'woocommerce_add_aff_link_open', 10);
add_action('woocommerce_before_shop_loop_item_title', 'woocommerce_add_aff_link_close', 10);

function woocommerce_add_aff_link_open(){
  $product = wc_get_product(get_the_ID());
  if( $product->is_type( 'external' ) )
    echo '<a href="' . $product->get_product_url() . '" class="woocommerce-LoopProductImage-link">';
}

function woocommerce_add_aff_link_close(){
  $product = wc_get_product(get_the_ID());
  if( $product->is_type( 'external' ) )
    echo '</a>';
}

I just need the title to link like the image and everything opens in new tabs.

Can someone say how can I continue?

Thank you

IMAGE

If you want open link in a new tab then change one line of code to these echo ''; } But can you please specify about title? What do you mean title like image? — Oleg Apanovich, Mar 12 '18 at 20:10
Perfect! the images open in a new tab! Excuse my definition. I want the name of the product also to point to the affiliate link. I attach an image to make it more visual. Thank you very much Oleg Apanovich. :) — Enric Serra Duran, Mar 13 '18 at 10:57

score 1 · Accepted Answer · answered Mar 13 '18 at 15:05

If you want to open link attached to image in a new tab for a external products in your shop page then edit your code like these

remove_action('woocommerce_before_shop_loop_item', 'woocommerce_template_loop_product_link_open');
add_action('woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_link_open', 15);
add_action('woocommerce_before_shop_loop_item', 'woocommerce_add_aff_link_open', 10);
add_action('woocommerce_before_shop_loop_item_title', 'woocommerce_add_aff_link_close', 10);

function woocommerce_add_aff_link_open(){
    $product = wc_get_product(get_the_ID());

    if( $product->is_type( 'external' ) ) {
        echo '<a target="_blank" href="' . $product->get_product_url() . '" class="">';
    }
}

function woocommerce_add_aff_link_close(){
    $product = wc_get_product(get_the_ID());

    if( $product->is_type( 'external' ) ) {
        echo '</a>';
    }
}

Then if you want title will be opened in a new tab with external link than add these overridden woocommerce function to your functions.php file of your theme too

function woocommerce_template_loop_product_link_open() {
    global $product;

    if( $product->is_type( 'external' ) ) {
        $link = apply_filters( 'woocommerce_loop_product_link', $product->get_product_url(), $product );
        echo '<a target="_blank" href="' . esc_url( $link ) . '" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">';
    } else {
        $link = apply_filters( 'woocommerce_loop_product_link', get_the_permalink(), $product );
        echo '<a href="' . esc_url( $link ) . '" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">';
    }
}

score 1 · Answer 2 · answered Feb 28 '19 at 11:13

Here is an cleaner approach to how you add target="_blank" to links on archive pages to open them in new tab:

function ns_open_in_new_tab($args, $product) 
{
    if( $product->is_type('external') ) {
        // Inject target="_blank" into the attributes array
        $args['attributes']['target'] = '_blank';
    }    

    return $args;
}
add_filter( 'woocommerce_loop_add_to_cart_args', 'ns_open_in_new_tab', 10, 2 );

Replace ns_ part with your own namespace abbreviation.

better solution in my eyes. Thank you – Orlando P. Aug 15 '19 at 17:04 — Orlando P., Aug 15 '19 at 17:04

Woocommerce - External/Affiliate Product Image and title to External Link (New tab)

2 Answers2

Linked