Prestige Theme - Cross Out Unavailable Variant

Store Design

Topic summary

Users are seeking to add a strikethrough effect to unavailable or sold-out product variants in the Prestige Shopify theme.

Initial Solution Proposed:

  • Add CSS class .unavailable-variant { text-decoration: line-through; } to the theme’s CSS file
  • Apply this class to variants where variant.available is false in the liquid template

Implementation Challenge:

  • The CSS alone doesn’t automatically work—liquid template modifications are required
  • The product page liquid doesn’t contain variant.unavailable code; it uses conditional logic like “if variant available” instead
  • Users report that adding only the CSS doesn’t produce visible changes

Current Status:

  • Multiple users (NMalone, hailkody, davinder, Starin, dimanoclothing) are experiencing the same issue
  • Some have shared store URLs for troubleshooting
  • The discussion remains unresolved, with users awaiting guidance on the necessary liquid template modifications
  • One user also requests showing unavailable sizes in red color as an additional feature
Summarized with AI on November 17. AI used: claude-sonnet-4-5-20250929.
1

Hi,

I’m wanting to cross out the unavailable variant similar to below.
Can anyone tell me if this is possible in the Prestige Theme?

Thanks so much!

NMalone_0-1620209322122.png

1 Like
2

@NMalone

Please share your website URL and password if any. I will check and provide a solution here.

Thanks!

3

Thank you so much!

It’s www.shanetafashion.com

1 Like
4

@NMalone

You should create a class for strikethrough and add this class for variants where variant. available is false in the liquid template.

The CSS for the class would be something as simple as:
Add the following at the bottom of your assets/theme.css file.

.unavailable-variant {
text-decoration: line-through;
}
5

Thank you. I have added the CSS to asset file, but not sure how to find the variant returning as false in the liquid.
Are you able to help any further?
Thanking you.

1 Like
6

@NMalone

If you see the above CSS code it only targets the unavailable variants so no need to go and check in liquid.

As you said you added code in CSS file. Is this working for you?

If this works then no need to change in liquid.

Let me know.

7

Hi,

No it hasn’t made any changes to the website - all variants are still showing as normal.

8

In the product page liquid, there’ no variant.unavailable code, it only has something along the lines of “if variant available”. Is it possible to work around that?

9

@dmwwebartisan

Hello,

I would like to add a strike through for out of stock items.

Currently on the prestige theme.

Could you please help me out.

Thank You

1 Like
10

@hailkody

Please share your store URL and a screenshot.

11

@dmwwebartisan

I sent you a PM

12

@dmwwebartisan

I sent you and email and a PM.

Could you let me know if you can help me out.

thanks

13

Hi,

I’m wanting to cross out the unavailable variant.
Can anyone tell me if this is possible in the Prestige Theme?

Thanks so much!

14

Hey, i have the same issue.

https://starin.in/products/chain-corset-dress-baby-pink

15

@dmwwebartisan

Hello,

I would like to add a strike through for sold out products.

Currently on prestige theme, could you please help me out.

URL: https://www.starin.in/products/ivory-backless-ruched-dress

Thank You

16

Can you also help me with this issue? I want to show the unavailable sizes crossed out and if possible in red.

My website is dimano-clothing.com and theme is prestige