How can I remove the purchase button for sold out products?

Store Design
, , , , ,

Topic summary

A store owner wants to hide the purchase button when products are out of stock. They’ve already configured products to automatically move to a “sold out” collection when inventory reaches zero.

Proposed Solution:

  • Locate the purchase button code in the theme template (typically within a form block)
  • Add Liquid code to conditionally check product availability
  • Use conditional logic like {% if product.available %} to wrap the button markup
  • Close with {% endif %} to hide the button when stock is unavailable

The solution involves editing the product page template to add conditional Liquid tags that check inventory status before rendering the purchase button.

Summarized with AI on November 16. AI used: claude-sonnet-4-5-20250929.
1

Hi everyone,

I would like to remove the purchase button once a product is sold out. I made the settings in a a way that the products are added to the “sold out” collection once I have 0 stock.. in case it helps the coding part.

Hope someone can help:
https://woollenandkind.com/collections/sold-rugs/products/persian-6-6-x-3-4 (example product)

https://woollenandkind.com/collections/sold-rugs (collection)

Thank you in advance

2

Find the section of the template that displays the purchase button. This may vary depending on your theme, but it’s often within a form block or something similar. You’ll need to add Liquid code to check if the product is sold out and conditionally hide the purchase button.

{% if product.available %}
  
  
{% endif %}