"more colours available"

Site URL: https://maxishop.ca/marc-cain

-Is there code to add below each item in gallery that indicates 'more colours available' ?

On 7/31/2021 at 2:14 AM, maxi said:

Site URL: https://maxishop.ca/marc-cain

-Is there code to add below each item in gallery that indicates 'more colours available' ?

It is "text only" or?

yes text only

On 9/18/2021 at 10:52 PM, maxi said:

yes text only

 

Add to Design > Custom CSS

div.ProductList-item:after {
    content: "more colors";
    display: block;
    position: absolute;
    bottom: -5px;
    z-index: 9999;
    visibility: visible !important;
    left: 50%;
    transform: translateX(-50%);
    font-size: 20px;
}

Thank you .. but the programming above adds the text ( more colors ) to all items .. I cannot edit and control which items have more colors and which fo do not ? the CSS added the text to all items 😕

Also this CSS code no longer works ? would you know why ? 

header.Header [href*="Category=sale"] {
    color: #FF0000 !important;

On 11/1/2021 at 9:39 PM, maxi said:

Thank you .. but the programming above adds the text ( more colors ) to all items .. I cannot edit and control which items have more colors and which fo do not ? the CSS added the text to all items 😕

#1. First, add tag: more-colors for products you want to add more colors text

next, add this new code

.tag-more-colors div.ProductList-item:after {
    content: "more colors";
    display: block;
    position: absolute;
    bottom: -5px;
    z-index: 9999;
    visibility: visible !important;
    left: 50%;
    transform: translateX(-50%);
    font-size: 20px;
}

#2. Your code for?