Last active
October 29, 2020 01:34
-
-
Save carolineschnapp/bc54f3fabe2e9f4a770a 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
hi when I use this code it's hiding my main image, how can I fix this