How to remove strike through line on sold out product variants

Solved

How to remove strike through line on sold out product variants

Shopbeenthat
Tourist
11 0 2

4B04C06B-C52C-47F5-9D41-56AE4BC1BCDF.jpeg

Hi I’m having a hard time figuring out how to remove the strikethrough line on sold out variants. I would like to keep them greyed out but only remove this line because I installed a “notify me when back in stock” button that does not appear unless a customer clicks on the sold out variant, so most customers are not clicking on it since they can clearly see the product is sold out beforehand. 
I hope this makes sense and someone can help me with a code or anything to remove this. 
btw I am using the DAWN theme

 

Thank you !

Accepted Solution (1)
DaviesYoung
Shopify Partner
11 4 6

This is an accepted solution.

First revert back to class="disabled". Open Editor (page > Default product) and add Custom CSS to the Product information template/section:

 

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

 

 My other two cents 😉

Davies&Young — Graphic Banners, Collection Thumbs and Social Media Promos for your Shopify Store.
+ Easy to Customize; Start for Free.

View solution in original post

Replies 11 (11)

Huptech-Web
Shopify Partner
941 188 197

Hi @Shopbeenthat 

Can you share the store URL and password if the store is password-protected

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at info@huptechweb.com or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required
Shopbeenthat
Tourist
11 0 2

DaviesYoung
Shopify Partner
11 4 6

Maybe disabling the disable class?
- Snippets > product-variant-options.liquid (l.59, Dawn 12)

 

{% if option_disabled %}
  class="!disabled"
{% endif %}

 

My two cents. Good luck!

Davies&Young — Graphic Banners, Collection Thumbs and Social Media Promos for your Shopify Store.
+ Easy to Customize; Start for Free.
Shopbeenthat
Tourist
11 0 2

Hi thank you so much for the quick response! It worked the strikethrough lines are gone but it also took away the grey out . Any suggestions on how to keep them greyed out & only remove the strikethrough lines?

DaviesYoung
Shopify Partner
11 4 6

This is an accepted solution.

First revert back to class="disabled". Open Editor (page > Default product) and add Custom CSS to the Product information template/section:

 

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

 

 My other two cents 😉

Davies&Young — Graphic Banners, Collection Thumbs and Social Media Promos for your Shopify Store.
+ Easy to Customize; Start for Free.
Shopbeenthat
Tourist
11 0 2

It worked perfectly! You’re amazing! Thanks so much !

landofaahs
Visitor
1 0 0

The code worked great for removing the strikethrough.  However, I noticed that the sold out variant button is a lighter shade than the others.  Is there a way to make them look exactly like the others?Variant Picker.png

DIEVIER
New Member
5 0 0

hello i need help on this can you help me out on how to get this remove and what section to go to?

PlyOnline
Visitor
1 0 0

Hi! If I'm using the Enterprise 1.4.0 theme, where can I find the right snippet? I don't have product-variant-options.liquid in my drop-down.

 

Guifonte
Tourist
24 0 2

hey, how did you make the strikethrough line on Dawn theme?