WooCommerce-外部/附属产品标题和存档页面上的图像到外部链接（“新建”标签） [英] WooCommerce - external/affiliate product title and Image on archive page to external link (New Tab)

问题描述

我已将以下代码添加到我的function.php文件中，以使我的外部/关联产品标题和产品归档页面上的图像链接到外部链接（在新标签中打开）-由Oleg Apanovich提供。

I have added the following code to my function.php file in an attempt to have my external/affiliate product title and images on the product archive page link to the external link (opening in a new tab) - provided by Oleg Apanovich.

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>';
}
}


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">';
}
} 

您可以在此处查看网站： https://dallavita.com/shop/

You can view the site here: https://dallavita.com/shop/

此代码当我单击外部/关联产品图片和标题时，可以正常工作。但是，我还有两个重复的购买项目按钮，显示时以及单击时都打开，但不在新标签中。

This code works as desired when I click on the external/affiliate product image and the title. However, I also have two duplicate "purchase item" buttons that display and when clicked open, but not in a new tab.

外部附属产品当前如何显示和显示;悬停在上方时：
在此处输入图片描述

How the external affiliate products currently show up & when hovered over: enter image description here

有关我希望如何显示外部/附属产品的详细信息：
在此处输入图片描述

Details on how I'd like to have the external/affiliate products display: enter image description here

理想情况下，我希望存档页面上具有外部/关联产品的样式，几乎与简单产品完全匹配（而不是显示添加到购物车功能，而是购买产品按钮文本）。然后，当外部/附属产品标题，图像，价格或购买按钮为单击，它将在新选项卡中打开外部链接。

Ideally, I am looking to have the style of the external/affiliate products on the archive page, match almost exactly that of the simple product (whereas instead of having 'add to cart' function display, it would be the buy product" button text). And then when the external/affiliate product title, image, price, or buy button was clicked, it would open the external link in a new tab.

任何帮助将不胜感激！

谢谢！

推荐答案

以下是添加 target = _ blank 到存档页面上的链接以在新选项卡中打开它们：

Here is 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 );

用您自己的名称空间缩写替换 ns _ 部分

Replace ns_ part with your own namespace abbreviation.

这篇关于WooCommerce-外部/附属产品标题和存档页面上的图像到外部链接（“新建”标签）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！