Jump to content

Changing button color of sold out variants

Recommended Posts

Hi, I'm selling products on my website but I do not want to display any pricing. In order to do this I marked everything as "0" inventory, including the variants, and then changed the status badge to display the text I chose, instead of "sold out".

However, now my variants are showing up in a dimmed color and every time you hover over them it shows the crossed out circle. Can I change the color of my variants to my main button color? Can I get rid of the hovering slashed circle? Photo attached below. Any help would be greatly appreciated! 

Screen Shot 2023-12-05 at 5.22.05 PM.png

Link to comment
  • Replies 1
  • Views 1.2k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

Hi @nsedagha!

This might help....  This code will remove the Add to Cart button, the quantity, and the price from showing up. That will allow you to give the inventory a number other than 0 and should fix the issue of the slashed circles.

Just click the gear icon on the store page, click Advanced, then Page Header Code Injection and paste this code -


 .sqs-add-to-cart-button-wrapper, .product-quantity-input, .product-price {
    display: none !important;

Jessica Miller | Squarespace Website Designer

Search the blog and get Squarespace tips to your inbox

Want to pick my brain or get help? Book a free 15 minute call.

If my post solved your problem, please mark it as the solution - thanks!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.