Wells 7.0 - Shop and Product pages - "sale" and "sold out" tag customizations

Site URL: https://www.millicentharvey.art/

https://www.millicentharvey.art/new-products

PW - Photo2022

Hello!

The "Sale" tags on the shop pages are not on brand - how can I adjust them to match the purple buttons I have on the rest of the website? 

I tried the code presented here with no success:

https://insidethesquare.co/squarespace-tutorials/sales-stickers

https://drive.google.com/file/d/1GKVRh8OsV7_XsrwESRWJua1Mv9a-qQEH/view

I also found this:

https://www.heathertovey.com/blog/change-default-text-labels/

which worked great but doesn't effect the colors or shape - only the words.

1 hour ago, mprDesigns said:

Site URL: https://www.millicentharvey.art/

https://www.millicentharvey.art/new-products

PW - Photo2022

Hello!

The "Sale" tags on the shop pages are not on brand - how can I adjust them to match the purple buttons I have on the rest of the website? 

I tried the code presented here with no success:

https://insidethesquare.co/squarespace-tutorials/sales-stickers

https://drive.google.com/file/d/1GKVRh8OsV7_XsrwESRWJua1Mv9a-qQEH/view

I also found this:

https://www.heathertovey.com/blog/change-default-text-labels/

which worked great but doesn't effect the colors or shape - only the words.

 

Do you mean changing the color of the sale tag on product page?

9 minutes ago, bangank36 said:

Do you mean changing the color of the sale tag on product page?

yes, i'd like the Sale and Sold Out tags to match the Add To Cart button in color and shape.

Try adding to Home > Design > Custom Css

#productList .product .product-mark, #productDetails .product-mark  {
  background: #330066;
}

Let me know how it works on your site

My testing

7 minutes ago, bangank36 said:

Try adding to Home > Design > Custom Css

#productList .product .product-mark, #productDetails .product-mark  {
  background: #330066;
}

Let me know how it works on your site

it works! Thanks. it finally matches!! 

Is there any way to adjust the shape of the tag?

8 minutes ago, mprDesigns said:

it works! Thanks. it finally matches!! 

Is there any way to adjust the shape of the tag?

You can try adding   padding: 15px; to my previous code

20 hours ago, bangank36 said:

You can try adding   padding: 15px; to my previous code

That changed the overall size of the purple area of the button but not the shape

@Beyondspace I am also using 7.0 and trying to change the color of the sale tag. I plugged it into my css and it worked once, but then stopped working.

thank you for any help'!

On 11/21/2023 at 4:51 PM, 2Eyeballs said:

@Beyondspace I am also using 7.0 and trying to change the color of the sale tag. I plugged it into my css and it worked once, but then stopped working. My page is

 

password: SALE25

thank you for any help'!

I specifically got your code to work for the individual products, but how can I make it apply to all products on a page? I tried this code to try to change the color of the sale price only, but it doesn't work:

#product-price .visually-hidden .v6-visually-hidden {
  color: #dc9395 !important;
}

10 hours ago, 2Eyeballs said:

I specifically got your code to work for the individual products, but how can I make it apply to all products on a page? I tried this code to try to change the color of the sale price only, but it doesn't work:

#product-price .visually-hidden .v6-visually-hidden {
  color: #dc9395 !important;
}

 

I saw you add the background for all sale tag already?