If you run a Squarespace store where customers inquire before purchasing, like an art gallery, furniture shop, or boutique service business, you may not want buyers to check out directly online.

Instead, you’d prefer they get in touch first.

In this guide, I’ll show you how to hide the Add to Cart and Quantity buttons in your Squarespace store and replace them with a custom “Enquire” button. This tutorial is fully updated for the latest Squarespace code changes in 2025.

Why Hide the Add to Cart Button in Squarespace?

Not every business operates on a direct e-commerce model. For example, if you sell high-ticket items such as artwork, jewelry, or collectibles, customers rarely click “Add to Cart” and check out instantly.

Instead, they’ll contact you first, maybe to request a quote, confirm availability, or arrange a private viewing.

Unfortunately, Squarespace doesn’t include a built-in option to hide the Add to Cart button or the quantity selector, but with a little custom CSS, you can easily customize your product pages to suit your workflow.

*Want a framework for designing the perfect homepage?*

Access now

Need an expert to build your Squarespace website?

Book a free kick-off call with our team to discuss your project requirements in detail.

Schedule a call

Step 1: Open Chrome Developer Tools

First, navigate to the product page where you want to hide the button.

On a Mac, open Chrome Developer Tools by pressing Shift + Command + C (or Ctrl + Shift + C on Windows). Hover over the Add to Cart button to find the correct CSS selector.

Copy the class or element name shown in the inspector, this will be unique to your Squarespace template.

Step 2: Hide the Add to Cart Button with Custom CSS

Next, go to your Squarespace dashboard > Design > Custom CSS.

Paste the following code, replacing the selector with the one you copied:

.sqs-add-to-cart-button {

display: none !important;

}

Once you save, your Add to Cart button will disappear.

If you also want to hide the Quantity Selector, inspect that element in Chrome Developer Tools and copy its selector as well. Then, add it to the same CSS rule separated by a comma:

.sqs-add-to-cart-button, .product-quantity-input-wrapper {

display: none !important;

}

Now both elements will be hidden on your product pages.

Step 3: Hide the Buttons on Specific Products Only

If you don’t want to hide these buttons across your entire store, you can apply the CSS to individual products only.

Open the product in the Squarespace editor.
Scroll to the Additional Info section.
Add a Code Block.
Insert the following code inside the block:

<style>

.sqs-add-to-cart-button, .product-quantity-input-wrapper {

display: none !important;

}

</style>

This will hide the Add to Cart and Quantity buttons only for that specific product.

Step 4: Add a Custom “Enquire” Button

Now that you’ve hidden the e-commerce buttons, let’s add a replacement, a simple “Enquire” or “Contact Us” button.

Go back to the product editor.
In the Description area, type something like: Enquire Now
Highlight “Enquire,” make it bold, and link it to your Contact Page

Step 5: Style Your Button with CSS

To make your new button look more professional, add some styling in Custom CSS:

a strong {

border: solid 1px;

padding: 20px 20px 20px 20px;

&:hover {

background: #000;

color: #fff;

}

This creates a clean, modern button with a hover effect that inverts the colors when users move their cursor over it.

You can adjust the border color, padding, and hover background to match your brand’s style.

Final Thoughts

With just a few lines of CSS, you can completely change the customer experience in your Squarespace store, turning it from a direct checkout site into a consultative, high-touch sales process.

This method is perfect for: