Theme: Impulse
I’d like customers to see which sizes are sold out without clicking on the product to find out. Here’s an example:
What code do I need to add & where?
Topic summary
Goal: show sold‑out sizes with a strikethrough on collection pages (product listing grid) so customers don’t have to open each product.
Approach shared: requires theme‑specific code customization. One CSS snippet was provided to draw a line on out‑of‑stock options, to be added in Assets/theme.scss.liquid:
- .out-of-stock-option::before { position:absolute; content:“”; width:90%; height:1px; background:#000; transform: rotate(15deg) translateY(12px); }
Theme notes and code locations: Some themes don’t support this out‑of‑the‑box and need edits to the product grid/card template (e.g., product-grid-item.liquid) to add classes/markup for sold‑out variants. An attempted larger code paste for one store did not work; the helper requested further details via PM.
Side thread resolved: a layout issue was fixed by adding .collections .container { max-width:100% !important; } to make collections full width. For sitewide width, the user applied .container { max-width:85% !important; } and it appeared to work.
Current status: No universal, copy‑paste solution posted for the strikethrough. Multiple users (Impulse, Prestige, Dawn) requested help; guidance is to share store URLs/screenshots and implement theme‑specific customizations. The main issue remains open.
2 Likes
Hello, @skywearthreads
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.
1 Like
Hi there @KetanKumar ,
Here’s the URL: https://skywearthreads.com/
It can be done by doing some code customization. Please take the help of a developer and hire Shopify Expert or me
1 Like
How much
Thanks please check on PM.
1 Like
I have the same problem can you help me ?
1 Like
Hello, @Fitinfiniti
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.
1 Like
The site is fitinfiniti.com
What I want is to make the container width bigger.
https://fitinfiniti.com/collections/women-all you can see that it’s not full width.
There is a code that I need to change the max-width: but I don’t find it. 
Thank you,.
1 Like
Thanks
- Go to Online Store->Theme->Edit code
- Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.collections .container {
max-width: 100% !important;
}
1 Like
Hello, @skywearthreads
Welcome to the Shopify community!
and Thanks for your Good question.
- Go to Online Store->Theme->Edit code
- Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.out-of-stock-option::before {
position: absolute;
content: "";
width: 90%;
height: 1px;
background: #000;
transform: rotate(15deg) translateY(12px);
}
1 Like
@KetanKumar Thank you a lot Ketan! It works! You really helped me!
But, there is only for the collections, maybe there is a code that I should change to change the width of all the pages. Thank you!
I write this code, and seems like it works. Is this right?
.container {
max-width: 85% !important;
}
1 Like
Yes, perfect
1 Like
I need help with this too, please can you help me?
thank you.
1 Like
Hello, @hayleyj
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.
1 Like
Hi! Thank you!
https://lwvqn88rc8go59ge-48633970837.shopifypreview.com/
Please lmk if that doesn’t work I’ll send the password privately?
1 Like
1 Like