Change $0 Price To Say Free

Install Steps

Change $0 Price To Say Free

Submitted by The Busy Bee Works with the Brine template family


Step One

From your products page, add a new product as you normally would.

Enter the product’s details, set the price to $0.00, and add the new tag “freebie” to the product. This tag is very important.

When done, save the product.

Step Two

From your Squarespace account, go to the Custom CSS Editor: Design > Advanced > Custom CSS

Step Three

Copy and paste the code below into the Custom CSS Editor box.

// Show Freebie As Price //

.tag-freebie .ProductItem-summary .ProductItem-details .product-price:before {
content: 'FREE';
color: #EA8485;
font-size: 16px;
font-weight: 400;
letter-spacing: 0.2em;

// Hide Zero Dollar Price //

.tag-freebie .ProductItem-summary .ProductItem-details .product-price .sqs-money-native {
display: none;

Step Four

Change the content text, color, font size, and font weight values to your liking.

Keep in mind that this will only target products with the added tag “freebie”. Do not forget to do this.

Save and refresh the page. 👍

Moov Labs