drabbytux

layout	title	description	nav
default	Limit cart quantities to in-stock items	You can prevent your customers from adding larger quantities to the cart than you have in stock at your online Shopify store.	group products

drabbytux

jQuery(function($) {
  $('form[action="/cart/add"]').submit(function() {
    var formIsValid = true;
    var message = "Please fill this out and you will be able to add the item to your cart.";
    $(this).find('[name^="properties"]').filter('.required, [required="required"]').each(function() {
      $(this).removeClass('error');
      if (formIsValid && $(this).val() == '') {
        formIsValid = false;
        message = $(this).attr('data-error') || message;
        $(this).addClass('error');

drabbytux

---

layout: default title: Recommend related products to your customers sidebar_title: Recommend related products description: Learn about related products and recommendations.

difficulty: intermediate

supported: false

nav: group: products

drabbytux

<script>
   var productOptions = [];
  {% for option in product.options %}
    var optionObj = {};
    optionObj[ {{ forloop.index0 }} ] = "{{ product.options[forloop.index0] }}";
    productOptions.push(optionObj);
  {% endfor %}
</script>

drabbytux

$(document).ready(function() {
   if( typeof(productOptions ) != "undefined" ){
     for(i=0;i<productOptions.length;i++) {
       if (['a', 'e', 'i', 'o', 'u'].indexOf(productOptions[i][i].substr(0, 1).toLowerCase()) !== -1 ) { 
       $('.single-option-selector:eq('+ i +')')
       .filter(function() {
         return $(this).find('option').length > 1
       })
       .prepend('<option value="">Pick an ' + productOptions[i][i] + '</option>')
       .val('')

drabbytux

{% 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') {

drabbytux

layout	title	sidebar_title	description	nav
default	Make 'Pick an option' the default choice in product drop-down menus	Make 'Pick an option' the default choice for drop-downs	Quick customization to your theme to let customers know there are variants.	group products

drabbytux

$(document).ready(function() {
  thumbnails = $('img[src*="/products/"]').not(':first');
  if (thumbnails.length) {
    thumbnails.bind('click', function() {
      var arrImage = $(this).attr('src').split('?')[0].split('.');
      var strExtention = arrImage.pop();
      var strRemaining = arrImage.pop().replace(/_[a-zA-Z0-9@]+$/,'');
      var strNewImage = arrImage.join('.')+"."+strRemaining+"."+strExtention;
      if (typeof variantImages[strNewImage] !== 'undefined') {
          productOptions.forEach(function (value, i) {

drabbytux

{% comment %}
Place this in your product.liquid template, at the bottom.
{% endcomment %}
{% if product.variants.size > 1 %}
<script>
  var variantImages = {},
    thumbnails,
    variant,
    variantImage,
    optionValue,

drabbytux

layout	title	sidebar_title	description	nav
default	Select product variants by clicking their images	Select variants by clicking their images	Enable customers to select a product variant by clicking its image on your online Shopify store.	group products