How to Remove Price from Product on Squarespace

If you want to remove the price from a product on Squarespace, you can easily do so using a few simple methods, including built-in options or custom CSS code. This article will guide you through the process of hiding product prices in Squarespace, explain why you might want to do it, and offer troubleshooting tips.

Why You Might Want to Remove the Price on Squarespace

There are several reasons why store owners might want to hide product prices on Squarespace. Here are the main ones:

• Custom Pricing: Some businesses prefer to set custom pricing based on customer requirements, subscription models, or bulk orders. Hiding prices allows for more flexibility.
• Request for Quote: If you want customers to contact you for pricing (for example, for high-value or negotiable items), removing the price helps encourage direct communication.
• Exclusive Products: For high-end or exclusive items, some sellers may prefer to display only product details, without showing the price publicly.

Can You Hide the Price on Squarespace Products?

Yes, you can hide the price of products on Squarespace by using either built-in features or custom code. Squarespace provides flexibility in customizing product pages, allowing store owners to hide or modify product prices according to their business needs.

How to Remove Price Using Built-In Features

You can remove the price from your product page without writing any code, using the built-in customization options in Squarespace.

1. Go to Your Product Page:
   • Navigate to your Squarespace admin panel and go to the Pages section.
   • Select the product you want to modify.
2. Disable the Price Display:
   • Under the Product Details section, you can either leave the price field blank or set the price as “Contact Us for Pricing”.
   • Some Squarespace templates also allow you to adjust visibility settings for prices directly.
3. Update the Page:
   • Once you make your changes, click Save to apply the changes. The price will no longer appear on the product page.

Can You Use CSS to Hide Product Price on Squarespace?

For more control over the appearance of your product pages, you can use custom CSS code to hide the price.

1. Open the Custom CSS Editor:
   • From the Squarespace admin panel, go to Design and then select Custom CSS.
2. Add the CSS Code: To hide the product price, add the following code in the CSS editor:
   
   .product-price {
   display: none;
   }This code will hide the price on all product pages where the class .product-price is applied.
3.  Save the Changes: After adding the code, click Save. The price will no longer be visible on the product page.

Step-by-Step Guide to Remove Price on Squarespace

Here’s a detailed step-by-step guide to removing the price from a product on Squarespace:

Method 1: Remove Price Using Squarespace Admin Panel

1. Log in to Your Squarespace Account: Access your Squarespace admin panel.
2. Navigate to the Product Page: From the Pages section, select the product you want to edit.
3. Disable the Price: In the Product Details section, leave the price blank or change it to “Contact for Price”.
4. Save the Changes: Click Save to apply the changes.

Method 2: Hide Price with Custom CSS

1. Go to Design Settings: In the admin panel, click on Design and then select Custom CSS.
2. Insert the Code: Add the following CSS code to hide the product price:.product-price {
   display: none;
   }
3. Save Your Changes: Click Save to apply the custom CSS. The product price will no longer be visible.