How do I remove “price” “add to cart” and “quantity” fields in the Store?

We’d like to use the Squarespace store area as a more sophisticated way to display our product than the gallery areas offer.

But we don’t want to show pricing or offer for immediate sale, so the price add to cart and quantity fields are not wanted. How do we remove them?

In your Product configuration, on the Advanced tab, add the following in the code-injection section:

<style>
.product-quantity-select,
.sqs-add-to-cart-button-wrapper {
 display:none;
}
</style>

Note this hides the quantity and add to cart buttons, but that means there is no logical “next” action for the user.

Thanks! Well done that totally works! Is there a similar solution to hide the price when they go to the shop gallery for individual product? I know how to do it in the main shop gallery using the style editor, but on the individual product page price still shows up. https://jeff-newell.squarespace.com/shop/2n095uxmmdwz7gb6yiqcmtti1hjbxl

Try adding this in the same injection spot if that doesn’t work, try adding it to the site-wide code injection:

<style>
.product-price { display:none }
</style>

Side note: that Reve Console looks fantastic. Good luck.

Try adding this in the same injection spot if that doesn’t work, try adding it to the site-wide code injection:

<style>
.product-price { display:none }
</style>

Side note: that Reve Console looks fantastic. Good luck.

You can add it directly in the product configuration advanced tab.You my friend totally rock! Thanks for the comment on the Reve console.

Little side note you shouldn't use CSS in the code injections. Use the custom css found in the style editor.

thanks. I will. So I know, what's the reasoning for that vs. the code injector.

All this code worked great for the NON-mobile version of my site, but when you view the mobile version of my website, the price information still shows up. How do I fix this?

This is the custom code that will eliminate ALL pricing info on mobile and computers. In the content manager, go to the products gallery > Product Settings > Advanced > Page Header Code Injection and paste this code:

<style>
.product-price,
.product-quantity-select,
.sqs-add-to-cart-button-wrapper {
 display:none;
}
</style>

This is a great thread, thanks.

Guys, wondering about eliminating price info until are added to cart/checkout? Can the code above be modified to achieve? If just this is inserted will user still be able to select item and proceed to next step?

<style>
.product-price {
 display:none;
 opacity: 0;
}
</style>

Thank you!

Thanks for the code to hide all the prices. Very helpful!

Does anyone know the code to hide the quantity too?Is there a possibility to create a button like “Enquire now” or “Book now” to create a link between the product page and a registering page for customers?

Thank you!

Can anyone help with actually doing this for one of our websites on squarespace for us? Just I am not a coder and don't want to risk mistakes.

I inserted a code in advanced tab as you advised but the quantity option is still visible. Can anyone please help me with that?Thank you, Neli.

You should try this one :

<style> .sqs-add-to-cart-button-wrapper { display:none; } <style> .product-quantity-select { display:none; } </style> <style> .product-price { display:none; opacity: 0; } </style>

It works for me :)

Hi Imaad. Thank you for your help. I embeded code in the advanced tab. The price and Add button are removed but the quantity option is still on. Do you maybe have some advice?

Neli
http://neli-strukelj.squarespace.com/izdelki/enojni-zepek

@ImaadBKK – Please don’t take this wrongly, but I would suggest reading up on CSS a little bit, try this SitePoint CSS Reference.

That CSS is awful, there’s redundancy (all those <style> tags, duplicate display: none) and code that doesn’t do anything (opacity: 0). Here it is rewritten:

<style>
.product-price,
.product-quantity-select,
.sqs-add-to-cart-button-wrapper {
 display: none;
}
</style>

@jhughes92 – I’ve reduced your CSS down, there was some redundancy in there and code that didn’t do anything: opacity: 0 is meaningless when the element is hidden.

I would urge everyone else that has taken this CSS verbatim to look at it again and see if they can simplify their use – remember, simpler code = faster, more efficient websites!

@sossy – Just try adding the CSS from @jhughes92 answer, the very worst thing that can happen is that you don’t like the changes it makes. Or it doesn’t even work. Either way it’s easy enough to undo.

I copied the code from @jhughes92 but the result is the same.

Product quantity is still visible. The price and the Add button are removed. Unfortunatelly I can’t change CSS by myself because I don’t have enough knowledge. Is there anything else I could try?Thank you

@florideja – it’s difficult to say what’s happening without seeing your site. Could you give us the address of a page where you’re trying to make the change?

Hi @neeklamy, here is the link to my page link text

Since I'm still working on the page is still hidden. The web page I'm working on is link text

Let me know if you need some other data to access the page.

Hello everyone!

I am really trying to figure out why the codes are working for everyone on this forum but me.I could have sworn they worked for me in the past but now seems they are not.Does anyone have any in site. I have been working for weeks on this site adding my products and now of course if the pricing shows we can not use these pages :(

Has this code stopped working for anyone else? Today I noticed all of my pricing and add to cart buttons were back. HELP!

The first time I embedded the code I managed to get rid of “Add to Cart” button and price but now the same code doesn’t work anymore. I never managed to remove quantity window.