Changing Sold Out Background colour - Impulse theme

cottage_living
New Member
6 0 0

Hi, can anyone help? I am trying to change the background colour on my 'sold out' banner on my collection pages. I have trawled the community pages and every code suggestion has not worked.

I currently have the default white background/black text which cannot easily be seen. I need to change the background the mid grey with white text or something similar. I have virtually no coding knowledge in liquid but have explored theme.css.liquid and see where you change the colour of the sale tag but cannot locate the 'sold-out' colour setting.

Thanks in advance for any help to this basic question!  

Replies 8 (8)

estherebube
Visitor
3 0 0

I can help you with that.

KINDLY CONTACT ME AND LET GET IT DONE.

WWW.FIVERR.COM/GLORYESTHER

oscprofessional
Shopify Partner
15834 2369 3072

Hello cottage_living,
Please share your site url and screenshot.
So that i can check and let you know the exact solution here.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
cottage_living
New Member
6 0 0

Hi, an example is below...I'd like to make the Sold Out label more obvious.  URL is https://thecottagegardeneruk

cottage_living_1-1606312250264.png

 

 

cottage_living
New Member
6 0 0

Hi, the URL is https://thecottagegardener.co.uk

An example is shown in another post where we have a white background and white label.  Many thanks for any advice.

Peebee
Shopify Partner
22 0 4

Hey Cottage_Living,

I have a simple solution to your problem, that doesn't need code 🙂 You can apply the 'Sold Out' product label the product of your choice via the ModeMagic App. 

Based on your requirement, first, you can create a custom label in 3 simple steps as below! 

Peebee_0-1606391171282.png

You can then apply it to your products, and you're done in a jiffy!

Peebee_1-1606391266827.png

Install the app from Shopify App Store or click the link - <Here> 

If you face any issues, reply right back & I'll be glad to help! 

ModeMagic
Featured on Shopify Staff Picks
Offering free store consultation for increased sales and conversions
Grab your limited time offer on install today!
estherebube
Visitor
3 0 0

jkreuz
Visitor
1 0 0

Not sure if you ever got an answer, but I had the same issue...

I was able to locate these attributes in the theme.scss.liquid file by searching for "sold" with ctrl+f:

jkreuz_0-1612838438016.png

I updated mine to match the color scheme of my footer, but you could enter any of the other color variables set by your css (ctrl+f "color variables" in the same file to find those)

I assume you could also hard-code your mid-grey and white hex colors there, and it would look something like this:

  &.grid-product__tag--sold-out {
    background-color: #6A6C6E;
    color: #fff;

 

cottage_living
New Member
6 0 0

Thanks for the suggestions but no programming seems to work on any of our site.  I have added suggested code modifications to the theme.css.liquid and it doesn't matter what I put in, it simply doesn't change things!

I now have another issue with the large Sold out large button (in place of the 'add to cart' button) on the product page being so feint it cannot be seen.  Is there anyone who can help. The Impulse Modern theme seems absolutely impossible to update for a novice.

Please can anyone help?

programme issue.jpg