Hide variants that are sold out

If you want to prevent sold-out variants from being selected, or hide them from your product page, you can do that by editing your theme code.

Note

If your products have more than one product option, you will need to link your product options instead of following this tutorial.

Caution

This document has not been verified to work with sectioned themes. We are currently reviewing our documentation and will update them soon. You can try to implement this on your theme, but keep in mind that it may not function.

Graying out the variants that are sold out

  1. Find the theme you want to edit, click Actions, and then click Edit HTML/CSS.

  2. In the Snippets directory, click Add a new snippet.

  3. Name your new snippet disable-sold-out:

Add new snippet
  1. In your new snippet file, paste this code hosted on GitHub.

  2. Click Save.

  3. In the Layout directory, click theme.liquid.

  4. Near the end of the file, right before the closing </body> tag, paste the following code:

    
    {% include 'disable-sold-out' %}
    
    
  5. Click Save.

Removing the variants that are sold out

  1. Find the theme you want to edit, click Actions, and then click Edit HTML/CSS.

  2. In the Snippets directory, click Add a new snippet.

  3. Name your new snippet remove-sold-out:

    Add new snippet
  4. In your new snippet file, paste this code hosted on GitHub.

  5. Click Save.

  6. In the Layout directory, click theme.liquid.

  7. Near the end of the file, right before the closing </body> tag, paste the following code:

    
    {% include 'remove-sold-out' %}
    
    
  8. Click Save.

Want to discuss this page?

Visit the Shopify Community