Disable sold-out variants

disable-sold-out.liquid

{% comment %}
  Disable sold-out variants.
  Only works for products that have one option.
  It won't work with products that have two or three options, like Size and Color.
  See: https://docs.myshopify.io/themes/customization/products/hide-variants-that-are-sold-out
{% endcomment %}

{% if product.options.size == 1 %}
  <script>
  var $addToCartForm = $('form[action="/cart/add"]');
  if (window.MutationObserver && $addToCartForm.length) {
    if (typeof observer === 'object' && typeof observer.disconnect === 'function') {
      observer.disconnect();
    }
    var config = { childList: true, subtree: true };
    var observer = new MutationObserver(function() { 
      {% for variant in product.variants %}
        {% unless variant.available %}
          jQuery('.single-option-selector option:eq({{ forloop.index0 }})').prop('disabled', true);
        {% endunless %}
      {% endfor %}
      jQuery('.single-option-selector').trigger('change');
      observer.disconnect();
    });  
    observer.observe($addToCartForm[0], config);
  }
  </script>
{% endif %}

https://prnt.sc/114r43n

You just need to change code in linked-option file. I guess you are getting problem in change variant ?

@aman-developer Thanks for your help
can you please publish your solved solution.

Hi all I am working on this website (https://kokorikko.com) I did everything specified and still have no result :/ do you have any idea ?
PS: I am using Motion Theme

Hi @aman-developer What about for Prestige theme? Thanks!

@rubenkss I can do. Lot of changes required in theme files along with linked-options snippet.

@aman-developer Thought would be easier... Many people asking for it on Internet and poor options... Thanks!

@rubenkss Just have need changes few elements like classes .. etc.

@aman-developer Count on you? ;)

hi. has a solution been found to the problem?