Jump to content

Customize On Sale Price Color

Recommended Posts

On 3/16/2021 at 11:22 PM, SJENKINS said:

Site URL: https://cornet-maroon-xkyb.squarespace.com

How do I change the SALE PRICE color in the custom CSS area? Need help ASAP 

 

Hi. Add to Design > Custom CSS

/* sale color */
.product-mark.sale {
    color: red !important;
}

Also you haven't changed SEO Title so the browser tab name still shows "Store 1"

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 4 months later...
On 8/13/2021 at 12:46 AM, plantshop203 said:

Hi @tuanphan, this code isn't working for my site. It changes all the price colors. Is there another CSS target? 

Can you share link to shop page on your site?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
6 hours ago, plantshop203 said:

hi @tuanphan

I turned on the sale price for this product

Thank you!

Hi,

Change color on listing page or individual page?

if list page, I don't see sale product

https://www.theoldyew.com/shop

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
On 8/20/2021 at 4:52 AM, plantshop203 said:

@tuanphan

listing page! see screenshot with red circle

 

 

Screen Shot 2021-08-19 at 5.50.47 PM.png

Add to Design > Custom CSS

/* sale price */
.product-price.product-price-clone span:nth-child(2) {
    color: red !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 4 months later...
2 hours ago, leiraoakdesigns said:

Hi there! I tried this cold but for some reason it's not working for me...any other ideas? Does it show up in this pale yellow for everyone? 

Screen Shot 2022-01-21 at 12.22.55 AM.png

Can you share link to product in screenshot? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
On 1/21/2022 at 6:06 PM, tuanphan said:

Can you share link to product in screenshot? We can check easier

Hi can I please have a code to change my sale price to red as well please. As can be seen with attached image the sale price comes out as a faded grey. Website: adicovintage.com.au

image.thumb.png.b0f8ffca9331093ae3aa54165493be95.png.dc81f473439ee9abfe2f439a59a17818.png

 
Link to comment
On 1/24/2022 at 11:47 AM, Domenic said:

Hi can I please have a code to change my sale price to red as well please. As can be seen with attached image the sale price comes out as a faded grey. Website: adicovintage.com.au

image.thumb.png.b0f8ffca9331093ae3aa54165493be95.png.dc81f473439ee9abfe2f439a59a17818.png

 

I see you changed sale to red?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
22 hours ago, tuanphan said:

I see you changed sale to red?

Correct, But I am having issues changing the dollar sale price i.e. it has $50 in grey as the sale price but I would like it to be in red. Would like to keep the original price showing in black and crossed out though next to the sale price.

Thank you 🙂

Link to comment
On 1/26/2022 at 1:51 PM, Domenic said:

Correct, But I am having issues changing the dollar sale price i.e. it has $50 in grey as the sale price but I would like it to be in red. Would like to keep the original price showing in black and crossed out though next to the sale price.

Thank you 🙂

Add this CSS

.on-sale .product-price>span:not(.original-price) {
    color: red !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 10 months later...
On 12/6/2022 at 5:20 AM, SoundsailAudio said:

Hi @tuanphan how do you change the color of the original price on the individual page? 

Hi,

Can you share link to a product? I can't find sale/original price

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.