-
-
Save justinmetros/f41c1afd5a16a5bf17f14aa69e2b3407 to your computer and use it in GitHub Desktop.
Make 'Pick an option' the default choice in product drop-down menus
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{% comment %} | |
See https://docs.shopify.com/themes/customization/products/how-to-add-a-pick-an-option-to-drop-downs | |
{% endcomment %} | |
{% unless product.selected_variant %} | |
{% if product.variants.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 option in product.options %} | |
$('.single-option-selector:eq({{ forloop.index0 }})') | |
.filter(function() { | |
return $(this).find('option').size() > 1 | |
}) | |
.prepend('<option value="">Pick a ' + {{ product.options[forloop.index0] | json }} + '</option>') | |
.val('') | |
.trigger('change'); | |
{% endfor %} | |
observer.disconnect(); | |
}); | |
observer.observe($addToCartForm[0], config); | |
} | |
</script> | |
{% endif %} | |
{% endunless %} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment