Changing Sold Out circle to "SOLD OUT" red text underneath product image

elliotsnowman
Tourist
3 0 2

Hi,

 

Trying to figure out a solution to this. Right now when a product is sold out on minimal theme it shows as a black circle over the product image. I want to have red text underneath the product image reading "SOLD OUT"

 

Is there a quick work around for this?

 

Thank you,

 

Elliot

 

 

KetanKumar
Shopify Partner
16942 1840 6343

Hello, @elliotsnowman 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
elliotsnowman
Tourist
3 0 2
0 Likes
KetanKumar
Shopify Partner
16942 1840 6343

@elliotsnowman 

Thanks 

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.badge--sold-out {
    bottom: 0;
    left: 0;
    margin-top: 0;
    margin-left: 0;
    background-color: transparent;
    color: red;
    width: auto;
    height: auto;
    right: 0;
    top: inherit;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
elliotsnowman
Tourist
3 0 2

@KetanKumar 

 

Thank you very much! That worked.

KetanKumar
Shopify Partner
16942 1840 6343

@elliotsnowman 

Thanks for update and support.

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
emad_assadi
Tourist
9 0 4

Hi, Thank you very much. This worked for me as well. I was wondering now if there is a way to center the sold out text?

Thanks in advance.

Emad

KetanKumar
Shopify Partner
16942 1840 6343

@emad_assadi 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
emad_assadi
Tourist
9 0 4

Hi @KetanKumar ,

 

Thank you for the reply.

My website is www.vanitasism.com.

I also noticed the sold out text is on top of the image. Is it  possible to place it below the image? This would prevent some aesthetic inconsistencies.

Thanks a lot.

KetanKumar
Shopify Partner
16942 1840 6343

@emad_assadi 

i can see bottom

KetanKumar_0-1618287580520.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing