在新选项卡中打开外部 WooCommerce 产品 - 添加属性 target="_blank"

Question

我已设法将属性 target="_blank" 添加到我的外部产品页面，但我似乎无法更改父（分组产品）页面上的 links。

我能够通过修改 external.php 并将标签添加到实际的 link 本身来做到这一点。

<p class="cart">
<?php sdnetwork(); sdcondition(); parent_permalink_button(); ?><a href="<?php echo esc_url( $product_url ); ?>" target="_blank" rel="nofollow" class="single_add_to_cart_button button alt"><img src="/wp-content/themes/wootique-child/images/icons/new_tab_icon.gif" alt="Opens in New Tab"> <?php echo esc_html( $button_text ); ?></a>
</p>

如何更改分组产品的父页面上的link来添加此属性，我的第一个想法是修改grouped.php，但link的生成方式不同。

<?php woocommerce_template_loop_add_to_cart(); ?>

我怎样才能将我的标签添加到上面生成的 link 中？我考虑过使用钩子，但我需要一些帮助。

编辑：

只是想知道我是否可以像这样使用 jQuery.....

jQuery(document).ready(function($) {
  $(".button.product_type_external").each(function() {
    $(this).find("a").attr("target", "_blank");
  });
});

问题是大多数 link 在页面加载时都被隐藏了，我担心这会占用大量资源，或者会吗？ jQuery.

还很陌生

http://mobilereactor.co.uk/shop/mobile-phones/sony-xperia-z5-compact-coral-deals/

编辑感谢cale_b解决了：

add_filter( 'woocommerce_loop_add_to_cart_link', 'add_target_blank', 10, 2 );

function add_target_blank( $link, $product ){
    global $post;
    $product = get_product( $post->ID );
        if( $product->is_type( 'external' ) ){
            // I simply added target="_blank" in the line below
            $link = sprintf( '<a rel="nofollow" href="%s" target="_blank" data-quantity="%s" data-product_id="%s" data-product_sku="%s" class="%s">%s</a>',
                    esc_url( $product->add_to_cart_url() ),
                    esc_attr( isset( $quantity ) ? $quantity : 1 ),
                    esc_attr( $product->id ),
                    esc_attr( $product->get_sku() ),
                    esc_attr( isset( $class ) ? $class : 'button' ),
                    esc_html( $product->add_to_cart_text() )
                );
            return $link;
        } else {
            // I simply remove target="_blank" in the line below
            $link = sprintf( '<a rel="nofollow" href="%s" data-quantity="%s" data-product_id="%s" data-product_sku="%s" class="%s">%s</a>',
                    esc_url( $product->add_to_cart_url() ),
                    esc_attr( isset( $quantity ) ? $quantity : 1 ),
                    esc_attr( $product->id ),
                    esc_attr( $product->get_sku() ),
                    esc_attr( isset( $class ) ? $class : 'button' ),
                    esc_html( $product->add_to_cart_text() )
                );
            return $link;
        }
}

Answer 1

如果跟踪代码，该函数会执行一些操作，然后加载模板 loop/add-to-cart.php。

如果您打开 loop/add-to-cart.php，您会发现应该如下所示的代码：

echo apply_filters( 'woocommerce_loop_add_to_cart_link',
    sprintf( '<a rel="nofollow" href="%s" data-quantity="%s" data-product_id="%s" data-product_sku="%s" class="%s">%s</a>',
        esc_url( $product->add_to_cart_url() ),
        esc_attr( isset( $quantity ) ? $quantity : 1 ),
        esc_attr( $product->id ),
        esc_attr( $product->get_sku() ),
        esc_attr( isset( $class ) ? $class : 'button' ),
        esc_html( $product->add_to_cart_text() )
    ),
$product );

要修改 link，请使用过滤器 (woocommerce_loop_add_to_cart_link)。

注意：切勿直接在插件文件夹中修改 WooCommerce 模板。使用他们优秀的 Template Structure 将模板复制到您的主题并在那里修改，否则您的更改将在您下次更新 WooCommerce 时丢失。

最后说明：跟踪代码简单并且当您使用好的 IDE 时很有趣。我个人是 PHPStorm 的超级粉丝 (https://www.jetbrains.com/phpstorm/)。

编辑

要仅为外部产品添加它，那么您将采取不同的方法。

您将利用过滤器，正如您在评论中提到的那样，在您的 functions.php 中编写一个函数来执行如下操作：

add_filter('woocommerce_loop_add_to_cart_link', 'my_external_product_links', 10, 2);

function my_external_product_links( $link, $product ) {
    // Set up the $target variable to contain the correct text depending on the product
    $target = ( 'external' == $product->product_type  ) ? 'target="_blank"' : '';
    // Use the code from the core function here, but with our modification to include target
    echo sprintf( '<a rel="nofollow" href="%s" data-quantity="%s" data-product_id="%s" data-product_sku="%s" class="%s" %s>%s</a>',
            esc_url( $product->add_to_cart_url() ),
            esc_attr( isset( $quantity ) ? $quantity : 1 ),
            esc_attr( $product->id ),
            esc_attr( $product->get_sku() ),
            esc_attr( isset( $class ) ? $class : 'button' ),
            esc_html( $product->add_to_cart_text() ),
            $target
        );
}

在上面的代码中，密切注意sprintf语句中新增的%s：

// Watch for this --->--->--->--->--->--->--->--->--->--->--->--->--->--->--->--->--->--->-->--->--->-vv
'<a rel="nofollow" href="%s" data-quantity="%s" data-product_id="%s" data-product_sku="%s" class="%s" %s>

Answer 2

这是一种更简洁的方法，可以将 target="_blank" 添加到 add_to_cart 链接以在新标签页中打开它们：

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_ 部分替换为您自己的命名空间缩写。

在新选项卡中打开外部 WooCommerce 产品 - 添加属性 target="_blank"

Open External WooCommerce Products in New Tabs - Adding Attribute target="_blank"

php

wordpress

jquery

hook

woocommerce