Is it possible to remove the strike through on sold out items?

Ask & Offer

Topic summary

  • Issue: The variant picker shows sold-out options with strike-through text. The poster wants to remove this visual styling so sold-out options look the same as in-stock options.

  • Constraint: Even without the strike-through, sold-out variants must remain unpurchasable (i.e., cannot be sold/added to cart).

  • Attempted approach: The poster inspected the product-variant-picker.liquid file to find where to adjust this behavior but did not find anything obvious to modify.

  • Ask: Guidance on how to disable or override the strike-through styling while keeping out-of-stock variants non-selectable/non-sellable.

  • Status: No solution or code changes provided yet; the request remains open and unresolved.

Summarized with AI on January 10. AI used: gpt-5.
1

on my variant picker, some items are sold out and have a strike through the wording. is it possible to remove the strike through and make it look like exactly like inventory that is in stock, but still keep it to where I can’t sell items that are out of stock.

I was thinking it would be in product-variant-picker.liquid, but nothing is really sticking out to me to solve what I’m trying to do.

1 Like
2

Search first it’s the rules, show your work.
https://community.shopify.com/search?q=remove+strike+through

At minimum provide working details , other people are not mind readers that magically have your exact same setup or know what it is.
i.e. the theme name etc

3

It is possible but where do you want to put those sold out items or how exactly do you wanna show it?

4

Hi, with Rubik Variant Images & Swatch, you can easily control how sold-out variants look on your variant picker. You can either hide sold-out swatches completely or remove the strike-through line so they look exactly like in-stock options, while still preventing them from being purchased.
To help you get to know our app better, I’m sharing the video below.

If you have any questions related to the setup, our support team will be happy to assist you.:blush:

5

Hey @ChonkyDog

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

6

Hi @ChonkyDog

In Dawn (and Dawn-based themes), sold-out variants usually get:

A class like:

  • .sold-out

  • .disabled

  • [aria-disabled="true"]

  • And CSS like:

    text-decoration: line-through;
opacity: 0.5;

This is not hardcoded in Liquid, which is why nothing “sticks out” in product-variant-picker.liquid.

BEST & SAFEST SOLUTION (CSS only)

Step 1: Add CSS override

Go to Online Store → Themes → … → Edit code → Assets → base.css

Add this at the bottom:

/* Remove strike-through from sold out variants */
.variant-input input:disabled + label,
.variant-input input[aria-disabled="true"] + label {
  text-decoration: none !important;
  opacity: 1 !important;
}

Removes strike-through
Makes sold-out variants look normal
Keeps them unselectable / unsellable

If You Are Using Button-Style Variants

Add this too (very common):

/* Button-style variant picker */
.product-form__input input[type="radio"]:disabled + label {
  text-decoration: none !important;
  opacity: 1 !important;
}

Best regards,
Devcoder :laptop:

7

ok, I have found something very close. I’ve added color black to it which gets the color, but the radio is still a bit gray. how can I change the variant radio to be black and not gray on dawn?

.product-form__input input[type=“radio”].disabled + label {
text-decoration: none;
color: black;
}