Auto-hide Sold Out Variants

Sale price Price $640.00 Regular price

Why show stuff that's not currently available? You can customize your product pages to hide the Sold-Out variants from view, and removing the option to purchase those. Less mistakes in ordering = less refunds!

In the next few steps we will show you how to auto-hide sold out variants. 
Start by clicking on the Online Store from the Shopify admin. Find the Theme you want to edit and click on Actions>Edit code.
Scroll down to the Sections directory and search for product-template.liquid . 

At the bottom of the file paste this code:

{% if product.options.size == 1 %} <script> var product_variants_removed = [ {%- for variant in product.variants -%} {%- unless variant.available -%} '{{ variant.title }}', {%- endunless -%} {%- endfor -%} ]; </script> {% endif %}

After this step is done, go to Assets directory and try to find theme.js or custom.js . 
If you are using a free theme from Shopify other than Brooklyn or Narrative, at the bottom of the file paste the following code:

$( document ).ready(function() {
  if( typeof product_variants_removed != undefined ) {  // was there items to be removed?
    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() {
        product_variants_removed.forEach(function(item){
          $('.single-option-selector option').filter(function() { return $(this).text() === item; }).remove();
        });
        observer.disconnect();
      });  
      observer.observe($addToCartForm[0], config);
      $('.single-option-selector').trigger('change');
    }
  }
});
If you are using Brooklyn theme at the bottom of the file paste the following code:
$( document ).ready(function() {
  $('single-option-selector__radio').trigger('change');
  if( typeof product_variants_removed != undefined ) {  // was there items to be removed?
    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() {
        product_variants_removed.forEach(function(item){
              $('#ProductSelect-option-size-'+item).remove();
          $('label[for=ProductSelect-option-size-'+item+']').remove();
        });
        observer.disconnect();
      });  
      observer.observe($addToCartForm[0], config);
      $('.single-option-selector__radio').trigger('change');     
    }
  }
});
If you use Narrative theme then at the bottom of the custom.js file paste the following code:
$( document ).ready(function() { if( typeof product_variants_removed != undefined ) { // was there items to be removed? var $addToCartForm = $('form[action="/cart/add"]'); if (window.MutationObserver && $addToCartForm.length) { var config = { childList: true, subtree: true }; product_variants_removed.forEach(function(item){ $('.single-option-selector option').filter(function() { return $(this).text() === item; }).remove(); }); } } });

Last step is to Save your work, and you are good to go! If you having any trouble with hiding sold out variants, contact us and we will do it for you. 

 

 

Client Reviews

x

Get in touch

Let us know about your project and will get back to you within 24hrs. If you'd rather speak to someone now

Call +971 4383 5588

By submitting this form you agree that Eastside Co. can contact you by the email address and
telephone number provided above. You may unsubscribe from these communications at
anytime. For information on how to unsubscribe, as well as our privacy practices and
commitment to protecting your privacy, check out our Privacy Policy.

What our clients say

Great service, pleased with the finished product. Account management has been great, and very helpful. Very happy with the overall experience - would recommend to anybody looking to create or update their Shopify web store.

Wasps Rugby Club