Oliver Bigras-Morin
Oliver Bigras-Morin

Reputation: 43

Hide add to cart button in WooCommerce but show stock status

I want to hide the add to cart button in WooCommerce but still show the stock status message... It's easy in CSS but i am looking for a solution in php.

For now i've been using this code below but it hide all the shop functionnality, I just need to hide the add to cart button and show the out of stock message if the product is out of stock.

  // Remove add to cart on single product pages
  add_action( 'woocommerce_single_product_summary', 'hide_single_product_prices', 1 );

  function hide_single_product_prices(){

global $product;

  if ( has_term( array('category1', 'category2', 'category3', 'category4'), 'product_cat', $product->get_id() ) ) :


  //Hide add-to-cart button, quantity buttons (and attributes dorpdowns for variable products)
if( ! $product->is_type('variable') ){

  remove_action('woocommerce_single_product_summary','woocommerce_template_single_add_to_cart', 30 );
  } else {

  remove_action( 'woocommerce_single_variation', 'woocommerce_single_variation_add_to_cart_button', 20 );
  }

  endif;
  }```

Upvotes: 2

Views: 1344

Answers (1)

JBoss
JBoss

Reputation: 776

So the issue is that when you remove the function 'woocommerce_template_single_add_to_cart' from 'woocommerce_single_product_summary' what you're actually doing is telling woocommerce not to load the template at all, located in: templates/single-product/add-to-cart. Which template loads there depends on the product type, but I'll assume simple for now.

If you look at that template, its not ACTUALLY just the add to cart button. It contains the call to wc_get_stock_html() that displays what you're looking for. So there isn't actually a good way just with removing a hook, to hide ONLY the button.

Instead what you'll have to do is one of two things: You can copy the add-to-cart/simple.php template into your theme, and edit it there with your logic. You'll likely want to wrap the button like this:

<?php if( ! your_custom_function( $product ) : ?>
    <div class='buttons-container'>
        <button type="submit" name="add-to-cart" value="<?php echo esc_attr( $product->get_id() ); ?>" class="single_add_to_cart_button btn btn--pink"><?php echo esc_html( $product->single_add_to_cart_text() ); ?></button>
    </div>
<?php endif; ?>

The downside to that is that if you want this to work for all product types, you'd have to copy each template and do something similar.

So alternatively, what you could do is remove the action - as you have in your code above, and then Re-add the stock display wherever you'd like it. I would lean this direction for the reason above. Something like this:

remove_action( 'woocommerce_single_product_summary','woocommerce_template_single_add_to_cart', 30 );
add_action( 'woocommerce_single_product_summary', function(){
    global $product;
    if( $product->is_purchasable() ){
        echo wc_get_stock_html( $product );
    }
}, 30 );

Upvotes: 2

Related Questions