Variant question: How to make an unavailable option unclickable or invisible

Topic summary

Issue: Store with multi-option products (e.g., Color + Length) wants unavailable variant combinations hidden (not just crossed out) and unclickable when a first option is selected.

Shopify guidance:

  • Delete specific sold-out variant combinations (irreversible; cumbersome if restocking).
  • Single-option products: supported tutorial to hide sold-out variants (Shopify themes only).
  • Multi-option products: unsupported tutorial that works on older themes, not Online Store 2.0 (OS 2.0). For help, consider a Shopify Expert.
  • Non-code workaround: export CSV, delete variants, and re-import later.
  • Apps can hide sold-out products, but typically hide entire products, not individual variants.

Latest updates:

  • OP tried the multi-option code; it didn’t work on a recent (likely OS 2.0) theme. Unavailable variants remain clickable despite being crossed out.
  • Theme is custom-built by a hired expert. Support recommends contacting the developer and checking the “Continue selling when out of stock” setting is disabled for affected variants.

Other input: Another user asked how the “crossed out” styling was achieved (theme vs. code unknown).

Status: Unresolved/ongoing. Likely requires custom theme changes for OS 2.0 or developer assistance. Screenshots were shared to illustrate variant UI and inventory settings.

Summarized with AI on February 12. AI used: gpt-5.

Thanks for the reply. Unfortunately, the theme we are using is was created by a Shopify expert I hired.