How to hide the Add To Cart button on sold out products in Squarespace.
The problem: By default, the "Add to cart" shows up even when a product is out of stock. Additionally, if an out of stock variant of a product is selected, the "Add to cart" is also still displayed.
How we're going to solve this: In the below steps, we'll show you how you can hide the "Add to Cart" button when the product is out of stock or sold out. We'll also set it up so that if you have products with variants, if a selected variant is out of stock, the "Add to Cart" button will be hidden when the out of stock/sold out variant is selected.
Step 1: Open the code injection settings in Squarespace
We'll be using the "Header" section of your code injection, to get to the right page in your Squarespace settings, you can use this simple guide from Squarespace: Getting to your Code Injection settings
Step 2: Copy & paste the following snippet
You can now simply copy-paste the below snippet into the "header" area of code injection you have opened in Step 1.
The below snippet hides the "Add to Cart" button whenever a product or a selected variant of a product is out of stock.
Want to automatically notify shoppers when out of stock products are back in stock?
Setup RestockNotify on your Squarespace shop →