Additional custom button for specific single product page in WooCommerce

问题

In WooCommerce on need to create another button that redirects to "Contact Us" form below my current "Add to Cart" button for specific product page (example: http://offers.elements.com.sg/product/ha-power-dose-facial/).

End product page:

There will be 2 different buttons for users to choose
One will be "Add to Cart" that leads to PayPal page and the other will lead to "Contact Us" form
Users can choose either one.

I'm using on OceanWP theme.

回答1:

Based on additional add to cart button with fixed quantity in woocommerce single product pages answer code, here is the way to do it:

add_action( 'woocommerce_after_add_to_cart_button', 'additional_single_product_button', 20 );
function additional_single_product_button() {
    global $product;

    // Define your targeted product IDs in the array below 
    $targeted_product_ids = array( 37, 53 );

    if( in_array( $product->get_id(), $targeted_product_ids ) ) {
        
        $link = home_url('/contact-us/'); // <== Here set button link
        $name = esc_html_( "Contact Us", "woocommerce" ); // <== Here set button name 
        $class = 'button alt';
        $style = 'display: inline-block; margin-top: 12px;';
    
        // Output
        echo '<br><a rel="no-follow" href="'.$href.'" class="'.$class.'" style="'.$style.'">'.$name.'</a>';
    }
}

Code goes in function.php file of your active child theme (active theme). Tested and works.

回答2:

You can use some third party plugins that will provide features to add buttons on a single product page.

or you can add a button in a single product file using coding .. you can use a single product file in the child theme from the WooCommerce templates folder.

or you can also use hook to add button in shop loop like this :

add_action( 'woocommerce_after_shop_loop_item', 'new_add_to_cart_button' );
function new_add_to_cart_button() {
    // Your button code.
}

回答3:

thank you for your reply! I tried your code but my product image and details went missing after adding the codes and the additional button did not show up. Not sure which part did I input it wrongly. Please advise, thank you.

add_action( 'woocommerce_after_add_to_cart_button', 'additional_single_product_button', 20 );

function additional_single_product_button() { global $product;

// Define your targeted product IDs in the array below 
$targeted_product_ids = array(871);

if( in_array( $product->get_id(), $targeted_product_ids ) ) {
    
    $link = home_url('http://offers.elements.com.sg/contact-us/'); // <== Here set button link
    $name = esc_html_( "Book Appointment", "woocommerce" ); // <== Here set button name 
    $class = 'button alt';
    $style = 'display: inline-block; margin-top: 12px;';

    // Output
    echo '<br><a rel="no-follow" href="'.$href.'" class="'.$class.'" style="'.$style.'">'.$name.'</a>';
}

}

来源：https://stackoverflow.com/questions/63113019/additional-custom-button-for-specific-single-product-page-in-woocommerce

标签

php

html

wordpress

woocommerce

product