Jump to content

Banners in shop page

Recommended Posts

  • Replies 5
  • Views 820
  • Created
  • Last Reply

Top Posters In This Topic

  • 2 weeks later...

#1. First, you need to create some tags: Limited Availability, New and assign products

Next, we can target products belong these tags to add code easier

#2. Add to Design > Custom CSS

/* Add AUD */
.product-price:after {
    content: " AUD";
}

 

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 month later...
  • 11 months later...
On 5/6/2023 at 9:38 AM, GastonDuflos said:

HI @tuanphan thank you very much, that works perfect for the AUD.

I've created the TAGS: SOLD OUT, NEW and LIMITED AVAILABILITY and I've assigned them to some of the products. How should I proceed? Thank you so much,.

You can use this code to Website > Website Tools > Custom CSS

div.tag-new figure.grid-image:after {
    content: "NEW";
    display: block;
    width: 100%;
    background-color: #f1f;
    color: #fff;
    padding: 5px;
    line-height: 20px;
    text-align: center;
}
div.tag-sold-out figure.grid-image:after {
    content: "SOLD OUT";
    display: block;
    width: 100%;
    background-color: green;
    color: #fff;
    padding: 5px;
    line-height: 20px;
    text-align: center;
}
div.tag-limited-availability figure.grid-image:after {
    content: "LIMITED AVAILABILITY";
    display: block;
    width: 100%;
    background-color: black;
    color: #fff;
    padding: 5px;
    line-height: 20px;
    text-align: center;
}

 

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

Contact Customer Care - Learn CSS - Buy me a coffee (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.