WooCommerce 缺货时的“联系”按钮

Question

Trying to achieve something that should be simple, but I've tried 3 approaches with multiple code variations and I just can't make it work. I'm trying to create a button that will appear in place of the "ADD TO CART" button on single product pages when the item is out of stock. Clicking the button will fire a popup contact form.

Is creating an add action in functions the right way to go, or should I replace the normal button with an if statement? I've tried both, so help with coding either would be greatly appreciated.

Answer 1

You can either hook into woocommerce_loop_add_to_cart_args using a filter in your functions.php or edit the template file directly by pulling it into your theme. Either way will require a bit of PHP.

If doing it in your functions.php , it would look something like this (untested but should send you down the right path):

<?php
add_filter( 'woocommerce_loop_add_to_cart_link', 'my_out_of_stock_button' );

function my_out_of_stock_button( $args ){
  global $product;
  if( $product && !$product->is_in_stock() ){
    return '<a href="' . home_url( 'contact' ) . '">Contact us</a>';
  }
  return $args;
}

I don't know what your button code should actually look like or what other information you need to capture, but this is how you could override the "Add to Cart" button and replace it if out of stock.

UPDATE

LoicTheAztec brought up a great point - the filter provided only affects the button on the archive, category, tag overview pages - not the individual product pages. There are no hooks for the individual product page buttons BUT you can copy the templates to your theme and override them .

You'll want to look at the files in templates/single-product/add-to-cart . Use a similar if statement as above:

#simple.php
<?php if ( $product->is_in_stock() ) : ?>
  // Standard WooCommerce code
<?php else: ?>
  // Your button code
<?php endif; ?>

Answer 2

Just add below code in functions.php file of your enabled theme reference

add_action('woocommerce_after_shop_loop_item', 'themelocation_change_outofstock_to_contact_us', 1);
// for shop page 
function themelocation_change_outofstock_to_contact_us() {
  global $product;
  if (!$product->is_in_stock()) {
    remove_action('woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart');
    remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart');
    //change the link to your contact us page
    echo '<a href="/contact"> Contact Us </a>';
  }
}
// for single page
add_filter('woocommerce_get_availability', 'wcs_custom_get_availability', 1, 2);
function wcs_custom_get_availability($availability, $_product) {
  // Change In Stock Text
  if ($_product->is_in_stock()) {
    $availability['availability'] = __('Available!', 'woocommerce');
  }
  // Change Out of Stock Text
  if (!$_product->is_in_stock()) {
    $availability['availability'] = __('<a href="/contact"> Contact Us </a>', 'woocommerce');
  }
  return $availability;
}

Answer 3

I was looking for a way to show a contact button on bespoke products and @ahwychkchih solution works great. One issue I had though is that schema markup will show as out of stock for those products which is not the case for beskpoke products is just they can't be purchased straight away so I've added this to force in_stock markup for my products. I'm aware that this solution would affect all products so you can always add a product id filter if needed

// Force In Stock schema markup
function fix_my_product_offers_schema ($markup_offer, $product) {
  if (!$product->is_in_stock()) {
        $markup_offer['availability'] = 'https://schema.org/InStock';
  }
  return $markup_offer;
}
add_filter('woocommerce_structured_data_product_offer', 'fix_my_product_offers_schema', 1, 2);