Shopify themes, liquid, logos, and UX
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!
Hello cottage_living,
Please share your site url and screenshot.
So that i can check and let you know the exact solution here.
Hi, an example is below...I'd like to make the Sold Out label more obvious. URL is https://thecottagegardeneruk
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.
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!
You can then apply it to your products, and you're done in a jiffy!
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!
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:
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;
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?
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024