Change the word 'Sold Out'
You can change the 'Sold Out' on product when it is out of stock to "Coming Soon" or other words. When you have a "Coming Soon" label on products, it actually helps in capturing leads before your product launch/restock.
Change the word 'Sold Out' and color
Remove 'Sold out' button background colour
⚠️ Kindly take note:
We do not allow to change or edit the code for the checkout page (which include shipping & payment method) due to security reasons
To change the word, there are 3 files need to be edited:
product-grid-item.liquid
product.liquid
search-result.liquid
price.liquid
Step 1: Go to EasyStore Admin > Channels > Online Store > Edit source > Layout
Step 2 : Go to theme.liquid > look for SoldOut

Let's say change sold out to coming soon

Step 3 : Save and you're all done!
Step 4 : Change the button color, go to EasyStore Admin > Channels > Online Store > Edit source > Assets > look for Base.css

Step 5: Search for .customer button { and then find 'background-color: rgba(var(--color-button), var(--alpha-button-background));' and change it to the color you want, example: 'rgba(128,0,0,1)' for Maroon color

Step 6: Search for '.button:disabled' and remove 'opacity: 0.5;' if want the button to look bright in color.


Step 1: Go to EasyStore Admin > Channels > Online Store > Edit source > Assets
Step 2 : Go to base.css > Look for background-color and insert the color code based on your preference
💡 Tips : You may get the color code of your preferred color [here](https://www.rapidtables.com/web/color/html-color-codes.html)

Step 3 : Save

In this article :
Change the word 'Sold Out' and color
Remove 'Sold out' button background colour
⚠️ Kindly take note:
We do not allow to change or edit the code for the checkout page (which include shipping & payment method) due to security reasons
1. Change the word 'Sold Out'
To change the word, there are 3 files need to be edited:
product-grid-item.liquid
product.liquid
search-result.liquid
price.liquid
Step 1: Go to EasyStore Admin > Channels > Online Store > Edit source > Layout
Step 2 : Go to theme.liquid > look for SoldOut

Let's say change sold out to coming soon

Step 3 : Save and you're all done!
Step 4 : Change the button color, go to EasyStore Admin > Channels > Online Store > Edit source > Assets > look for Base.css

Step 5: Search for .customer button { and then find 'background-color: rgba(var(--color-button), var(--alpha-button-background));' and change it to the color you want, example: 'rgba(128,0,0,1)' for Maroon color

Step 6: Search for '.button:disabled' and remove 'opacity: 0.5;' if want the button to look bright in color.

Result :

2. Remove 'Sold out' button background colour
Step 1: Go to EasyStore Admin > Channels > Online Store > Edit source > Assets
Step 2 : Go to base.css > Look for background-color and insert the color code based on your preference
💡 Tips : You may get the color code of your preferred color [here](https://www.rapidtables.com/web/color/html-color-codes.html)

Step 3 : Save
Result :

Updated on: 26/03/2024
Thank you!