Jump to content

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

Recommended Posts

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? 

image.thumb.png.f5044a8b1d5c08f45b1e06454e59cead.png

image.thumb.png.e71c8c133e9c17ac5d9f808bd0171246.pngI 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.

 

Edited by mprDesigns
update
Link to comment
  • mprDesigns changed the title to Wells 7.0 - Shop and Product pages - "sale" and "sold out" tag customizations
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? 

image.thumb.png.f5044a8b1d5c08f45b1e06454e59cead.png

image.thumb.png.e71c8c133e9c17ac5d9f808bd0171246.pngI 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?

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio plugin
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment

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

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio plugin
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment

My testing

image.thumb.png.28ea64611c019c2a730a714244cb98a8.png

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio plugin
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
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?

Edited by mprDesigns
Link to comment
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

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio plugin
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

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.