自定义添加到 Woocommerce 商店页面上的购物车按钮

Question

我目前使用此功能来更改单个产品页面上特定类别中的 'add to cart' 按钮。我希望这也可以更改缩略图下方商店页面上的 'add to cart button'。任何帮助将不胜感激。

// Display Auction Link When 'auction' is in the category
function so_43372512_maybe_show_auction_link(){
if( has_term( 'auction', 'product_cat' ) ) {
    echo ' <style type="text/css">
                .woocommerce div.product form.cart, .woocommerce div.product p.cart {
                display:none ; }
                .woocommerce div.product p.price, .woocommerce div.product span.price {
                display:none ; }
                .woocommerce div.product p.stock {
                display:none ; }
                .product_meta {
                margin-top:20px;
                }
            </style>';
    echo '<p>Click This Button To View The Lot         </p>';
    global $product; 
    $skusearch = $product->get_sku();
    echo '<a id="auction" style="font-size:100%;color:#fff;padding:.618em 1em;border-radius:3px;background-color:#ed1c24;font-weight:700;" href="https://www.wirebids.com/search?q=' . $skusearch . '&open_closed=open" target="blank">' . __ ( 'On Auction Now!', 'your-plugin' ) . '</a>';
}
}
add_action( 'woocommerce_single_product_summary', 
'so_43372512_maybe_show_auction_link', 35 );

Answer 1

您将在下面找到用自定义 'On Auction Now!' 按钮替换添加到购物车按钮的必要代码，也隐藏了产品价格…

我还完全重新访问了您的代码，删除了模板 "price" 和 "add to cart" 按钮，而不是使用 CSS 隐藏它们，仅针对 'auction' 产品类别...

代码：

// Remove the price on archive pages (like shop) for 'auction' product category
add_action('woocommerce_after_shop_loop_item_title', 'remove_price_from_archives', 9 );
function remove_price_from_archives(){
    global $product, $post;

    // Only for 'auction' product category
    if ( has_term( 'clothing', 'product_cat' ) )
        remove_action('woocommerce_after_shop_loop_item_title', 'woocommerce_template_loop_price', 10);
}

// Replace add to cart button on archive pages (like shop) for 'auction' product category
add_action('woocommerce_after_shop_loop_item', 'replace_add_to_cart_button_in_archives', 9 );
function replace_add_to_cart_button_in_archives() {
    global $product, $post;

    // Only for 'auction' product category
    if ( ! has_term( 'clothing', 'product_cat' ) ) return;

    // remove add to cart button
    remove_action('woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10);

    $skusearch = $product->get_sku();
    $style = 'style="font-size:100%;color:#fff;padding:.618em 1em;border-radius:3px;background-color:#ed1c24;font-weight:700;"';
    $href = 'href="https://www.wirebids.com/search?q=' . $skusearch . '&open_closed=open"';
    echo '<div style="margin-top:24px;">
        <a '.$href.' id="auction" '.$style.' target="blank">' . __ ( 'On Auction Now!', 'your-plugin' ) . '</a>
    </div>';
}

// Remove the displayed price and add-to-cart button on single product pages for 'auction' product category
// Replace add to cart by your custom "On Auction Now!" button
add_action( 'woocommerce_single_product_summary', 'remove_the_displayed_price_from_variable_products', 9 );
function remove_the_displayed_price_from_variable_products() {
    global $product, $post;

    // Only for 'auction' product category
    if ( has_term( 'clothing', 'product_cat' ) ){
        // remove product price
        remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_price', 10);
        // remove add-to-cart button
        remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30);
        // Add your custom "On Auction Now!" button
        add_action( 'woocommerce_single_product_summary', 'replace_add_to_cart_by_auction', 30 );
    }
}

// This function displays your custom button replacement in single product pages
function replace_add_to_cart_by_auction(){
    global $product;

    $skusearch = $product->get_sku();
    $style = 'style="font-size:100%;color:#fff;padding:.618em 1em;border-radius:3px;background-color:#ed1c24;font-weight:700;"';
    $href = 'href="https://www.wirebids.com/search?q=' . $skusearch . '&open_closed=open"';

    echo '<p>Click This Button To View The Lot</p>
    <a '.$href.' id="auction" '.$style.' target="blank">' . __ ( 'On Auction Now!', 'your-plugin' ) . '</a>';
}

代码进入您的活动子主题（或主题）的 function.php 文件或任何插件文件。

此代码已经过测试并且有效。

Answer 2

我必须在 woocommerce 构建的网站中自定义添加到购物车按钮，我只需要在商店和类别页面上执行此操作。

我用下面的函数完成了这个任务。将此功能放入您的 functions.php 文件中，并确保在进行任何更新之前进行备份，它对我有用，希望对您也一样。

add_filter( 'woocommerce_loop_add_to_cart_link', 'ij_replace_add_to_cart_button', 10, 2 );
function ij_replace_add_to_cart_button( $button, $product ) {
     
    $productid =  $product->id;
    $productslug =  $product->slug;
    $productname =  $product->name;
 
if (is_product_category() || is_shop()) {
     
$button_text = __("More Info", "woocommerce");
$button_link = $product->get_permalink(); 
$button = '<a href="'. $button_link .'"  data-quantity="1" class="button product_type_simple add_to_cart_button ajax_add_to_cart" data-product_id="'. $productid.'" data-product_sku="" aria-label="Add “'.$productname.'” to your cart" rel="nofollow"    data-productslug="'. $productslug.'" >' . $button_text . ' </a>';
return $button;
}
}

自定义添加到 Woocommerce 商店页面上的购物车按钮

Customizing add to cart buttons on Woocommerce shop page

php

wordpress

product

custom-taxonomy

woocommerce