How to remove strikethrough on color swatches?

[shayansidiqi]

I sell products with variant colors and sizes.
I don’t want the colors to be ever crossed out.

Currently, the default selection is the first option (in this case EU 40) and if the product is out of stock in that size the color swatch also gets crossed even if I have stock available in other sizes. You can see the screenshot attached.

Is there anyway for the color swatches to not get ever crossed.
I’m using theme pipeline.

Thank you

[Moeed]

Hey @shayansidiqi

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

[shayansidiqi]

Hello,

Here is the store link: https://ariaboutique.ae/

Thank you

[Betterave-Nina]

Hi @shayansidiqi .

Here’s how to remove the crossing bar from the color swatches.

Here’s how to hide the section on mobile.

1: Go to Online Store → Theme → Edit code
2: Search file theme.css
3: Add the following code to the bottom of the file → Save

.product__block__variants radio-swatch label::before {
	display: none !important;
}

If applied correctly, the result should be:

If you don’t want to add the code to theme files directly, you can use a code injection app like the one in my signature.

I hope this helps!

[devcoders]

Hello @shayansidiqi

1. From your Shopify Admin, navigate to Online Store > Themes > Edit Code
2. In the Assets folder, open theme.css and add your CSS code at the end

.swatch__button.sold-out a:before, .swatch__button input.sold-out~label:before, .swatch__button input.unavailable~label:before, .swatch__button input:disabled~label:before, .radio__button .sold-out+label:before, .radio__button .unavailable+label:before{
content: none!important;
}

[Moeed]

Hey @shayansidiqi

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

RESULT:

If I managed to help then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Dan-From-Ryviu]

Those variants are out of stock, so it has a strikethrough.

[shayansidiqi]

Hello,

Thank you so much for the answer. This worked and removed the strikethrough, but it also removed the strikethrough on the sizes as well, which is not desirable.

Thank you