Required parameter missing or invalid: items when adding to cart

[josen515]

Hello guys, I have my store over at: https://wearesocialculture.com/products/3-monkeys-design?variant=37433355239632

We got a new theme and for some reason we can't add to cart - we keep getting the error " Required parameter missing or invalid: items"

This is our product-template.liquid file.

 <option {% assign current_variant = product.selected_or_first_available_variant %} value="{{ variant.id }}">
  {{ variant.title }}
	</option>

<div id="product-{{ product.id }}"
  class="product-page product-template prod-{{ section.id }}"
  data-section-type="product-section"
  data-product-id="{{ product.id }}"
  data-section-id="{{ section.id }}"
  >

  <meta itemprop="name" content="{{ product.title }}">
  <meta itemprop="url" content="{{ routes.root_url }}{{ product.url }}">
  <meta itemprop="image" content="{{ product.featured_media.media | img_url: '1024x1024' }}">

  {% include 'product-json' %}


  {% if template != 'product.quick' %}
    {% if collection.description contains '[banner]' and section.settings.show_banner %}
      <div class="collection-banner">
        {% include 'collection-banner-image' %}
      </div>
    {% endif %}

    {% if section.settings.full_width %}<div class="gridlock-fluid">{% endif %}
  {% endif %}

  <div id="product-content" class="row grid_wrapper">
    {% if template != 'product.quick' %}
      {% include 'breadcrumb' %}
    {% endif %}

    {% if template == 'product.quick' %}  <!-- Product quick template only -->
        {% assign thumbnail_position = settings.thumbnail_position %}
        {% assign click_to_enlarge = settings.click_to_enlarge %}
        {% assign enable_video_looping = settings.enable_video_looping %}
        {% capture product_gallery_config %}{
        "thumbPosition": {{ settings.thumbnail_position | json }},
        "thumbsShown": {{ settings.thumbs_to_show | json }},
        "enableVideoLooping": {{ settings.enable_video_looping | json }},
        "navStyle": {{ settings.slide_controls | json }},
        "mainSlider": {% if product.media.size <= 1 %}false{% else %}true{% endif %},
        "thumbSlider": {% if product.media.size >= 4 %}true{% else %}false{% endif %},
        "productId": {{ product.id | json }},
        "isQuick": true
        }{% endcapture %}

        {% assign descr_width =  'desktop-5 tablet-3 mobile-3 span-5' %}

        <div id="product-photos" class="product-photos product-{{ product.id }} desktop-7 tablet-3 mobile-3 span-7"
             data-product-single-media-group data-gallery-config='{{ product_gallery_config }}'
             data-static-gallery>
             {% include 'product-static-gallery' %}

    {% else %}  <!-- Product template only, not product.quick -->

        {% case section.settings.image_section_size %}
        {% when 'small' %}
          {%- assign image_width = 'desktop-5 desktop-push-1 tablet-3 mobile-3 span-5 push-1' -%}
          {%- assign descr_width = 'desktop-5 tablet-3 mobile-3 span-5' -%}
        {% when 'medium' %}
          {%- assign image_width = 'desktop-6 tablet-3 mobile-3 span-6' -%}
          {%- assign descr_width = 'desktop-6 tablet-3 mobile-3 span-6' -%}
        {% when 'large' %}
          {%- assign image_width = 'desktop-8 tablet-3 mobile-3 span-8' -%}
          {%- assign descr_width = 'desktop-4 tablet-3 mobile-3 span-4' -%}
        {% when 'ultra' %}
          {%- assign image_width = 'desktop-9 tablet-3 mobile-3 span-9' -%}
          {%- assign descr_width = 'desktop-3 tablet-3 mobile-3 span-3' -%}
        {% endcase %}

        {% if section.settings.image_options == 'static' %}
          {% assign gallery_data = 'data-static-gallery' %}
          {% assign gallery_type = 'static' %}
        {% else %}
          {% assign gallery_data = 'data-scroll-gallery' %}
          {% assign gallery_type = 'scroll' %}
        {% endif %}

        {% assign thumbnail_position = section.settings.thumbnail_position %}
        {% assign click_to_enlarge = section.settings.click_to_enlarge %}
        {% assign enable_video_looping = section.settings.enable_video_looping %}
        {% capture product_gallery_config %}{
          "thumbPosition": {{ section.settings.thumbnail_position | json }},
          "thumbsShown": {{ section.settings.thumbs_to_show | json }},
          "enableVideoLooping": {{ section.settings.enable_video_looping | json }},
          "navStyle": {{ section.settings.slide_controls | json }},
          "mainSlider": {% if product.media.size <= 1 %}false{% else %}true{% endif %},
          "thumbSlider": {% if product.media.size >= 4 %}true{% else %}false{% endif %},
          "productId": {{ product.id | json }},
          "isQuick": false
        }{% endcapture %}

        <div id="product-photos" class="product-photos product-{{ product.id }} {{ image_width }}"
             data-product-single-media-group data-gallery-config='{{ product_gallery_config }}'
             {{ gallery_data }}>

            {% if product.featured_media and gallery_type == 'static' %}
            	{% include 'product-static-gallery' %}
            {% elsif product.featured_media and gallery_type == 'scroll' %}
            	{% include 'product-scroll-gallery' %}
            {% else %}
              {% capture current %}{% cycle 1, 2, 3, 4, 5, 6 %}{% endcapture %}
              {{ 'product-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
            {% endif %}

        {% endif %}  <!-- Product / product.quick variations end -->
        </div>

    	<div {% if template != 'product.quick' %}id="sticky-container"{% endif %} class="product-right {{ descr_width }}">
      <div {% if template != 'product.quick' %}id="sticky-item"{% endif %} class="product-description {% if template != 'product.quick' %} is_sticky{% endif %}">

        <div class="section-title">
          <h1>{{ product.title }}</h1>
        </div>

        {% if template != 'product.quick' %}
          {% capture description %}
            {% if section.blocks.size == 0 %}
              <div class="rte">
                {% if product.description contains '[#' %}
                {{ product.description | split: '[#' | first }}
                {% else %}
                {{ product.description | split: '<!-- split -->' | first }}
                {% endif %}
              </div>
            {% endif %}

            <div class="rte-tab">
              {% unless section.blocks.size == 0 %}
                {% for block in section.blocks %}
                    <input {% if forloop.first %}checked="checked"{% endif %} id="tab{{ forloop.index | plus:1 }}" type="radio" name="pct" />
                {% endfor %}
              {% endunless %}

              <nav>
                <ul class="tabbed">
                  {% unless section.blocks.size == 0 %}
                    {% for block in section.blocks %}
                      {% case block.type %}
                      {% when 'description' %}
                          <li class="tab{{ forloop.index | plus:1 }}"><label for="tab{{ forloop.index | plus:1 }}">{{ 'products.product.details' | t }}</label></li>
                      {% when 'page' %}
                      {% assign tab_page = pages[block.settings.page] %}
                          <li class="tab{{ forloop.index | plus:1 }}"><label for="tab{{ forloop.index | plus:1 }}">{{ tab_page.title }}</label></li>
                      {% when 'text' %}
                          <li class="tab{{ forloop.index | plus:1 }}"><label for="tab{{ forloop.index | plus:1 }}">{{ block.settings.tab_heading }}</label></li>
                      {% endcase %}
                    {% endfor %}
                  {% endunless %}
                </ul>
              </nav>
              <section>
                {% unless section.blocks.size == 0 %}
                  {% for block in section.blocks %}
                    {% case block.type %}
                    {% when 'description' %}
                      <div id="{{ block.id }}" class="tab{{ forloop.index | plus:1 }} tabbed-block rte">
                        {% if product.description contains '[#' %}
                        {{ product.description | split: '[#' | first }}
                        {% else %}
                        {{ product.description | split: '<!-- split -->' | first }}
                        {% endif %}
                      </div>
                    {% when 'page' %}
                    {% assign tab_page = pages[block.settings.page] %}
                      <div id="{{ block.id }}" class="tab{{ forloop.index | plus:1 }} tabbed-block rte">
                        {{ tab_page.content }}
                      </div>
                    {% when 'text' %}
                      <div id="{{ block.id }}" class="tab{{ forloop.index | plus:1 }} tabbed-block rte">
                        {{ block.settings.tab_content }}
                      </div>
                    {% endcase %}
                  {% endfor %}
                {% endunless %}
                {% if section.settings.size_chart_type == 'product-tab' and product.description contains '[#size]' %}
                  {% assign shortcode_description = product.description | split: '[/size]' | first | split: '[#size]' | last %}
                  {% if section.settings.size_chart_content == 'individual' %}
                    <a data-fancybox class="product-size-chart" data-src="#product-size-chart" href="javascript&colon;;"><i class="fas fa-ruler"></i> {{ 'products.product.sizing' | t }}</a>
                    <div id="product-size-chart" style="display: none;">
                      {{ shortcode_description }}
                    </div>
                  {% endif %}
                {% endif %}
              </section>
            </div>
          {% endcapture %}

          {% if section.settings.product_description_position == 'above' %}
              {{ description }}
              <div class="clear"></div>
          {% endif %}
        {% endif %}

        {% unless product.template_suffix == 'not-for-sale' %}
        {% capture product_form_config %}
         { "money_format": {{ shop.money_format | json }},
           "enable_history": true,
           "sold_out": {{ "products.product.sold_out" | t | json }},
           "button": {{ 'products.product.add_to_cart' | t | json }},
           "unavailable": {{ 'products.product.unavailable' | t | json }},
           "quickview": {% if template == 'product.quick' %}true{% else %}false{% endif %}
         }
         {% endcapture %}

        <div class="product-form">
          {% include 'product-form' %}
        </div>
        {% endunless %}

        {% if template == 'product.quick' %}
          <div class="rte">
          {{ product.description | truncatewords: 20 }}<br />
          <a href="{{ product.url }}">{{ 'products.product.details' | t }}</a>
          </div>
        {% endif %}
      {% if template != 'product.quick' %}
        {% if product.description contains '[#size]' or product.description contains '[#video]' or product.description contains '[#other]' %}
          <div class="product-extra">
            {% if section.settings.show_product_size_chart and product.description contains '[#size]' %}
              {% assign shortcode_description = product.description | split: '[/size]' | first | split: '[#size]' | last %}
              <a data-fancybox class="product-size-chart" data-src="#product-size-chart" href="javascript&colon;;">{{ 'products.product.sizing' | t }}
                <div id="product-size-chart" style="display: none;">
                  {{ shortcode_description }}
                </div>
              </a>
            {% endif %}
            {% if section.settings.show_product_video and product.description contains '[#video]' %}
              {% assign shortcode_description = product.description | split: '[/video]' | first | split: '[#video]' | last %}
              <a data-fancybox class="product-video" data-src="#product-video" href="javascript&colon;;"><i class="la la-play-circle"></i> {{ 'products.product.video' | t }}
                <div id="product-video" style="display: none;">
                  {{ shortcode_description }}
                </div>
              </a>
            {% endif %}
            {% if section.settings.show_product_model and product.description contains '[#other]' %}
              <a data-fancybox class="product-model" data-src="#product-model" href="javascript&colon;;"><i class="la la-info-circle"></i> {{ 'products.product.model' | t }}
                <div id="product-model" style="display: none;">
                  {% assign shortcode_description = product.description | split: '[/other]' | first | split: '[#other]' | last %}
                  {{ shortcode_description }}
                </div>
              </a>
            {% endif %}
          </div>
        {% endif %}

        {% if section.settings.product_description_position == 'below' %}
          <div class="clear"></div>
          {{ description }}
        {% endif %}
        <div class="clear"></div>
       {% endif %}
      </div>
    </div>
  </div><!-- Close the wrapper / container allowing full width layout for lower  container -->
  {%- if section.settings.show_social_share -%}
  {% include 'social' with product %}
  {%- endif -%}

{% if template != 'product.quick' %}
 {% if section.settings.lower_description == 'large' %}
   {%- assign lower = 'desktop-12 tablet-6 span-12' -%}
 {% elsif section.settings.lower_description == 'medium' %}
   {%- assign lower = 'desktop-8 desktop-push-2 tablet-6 span-8 push-2' -%}
 {% elsif section.settings.lower_description == 'small' %}
   {%- assign lower = 'desktop-6 desktop-push-3 tablet-4 tablet-push-1 span-6 push-3' -%}
 {% endif %}

  {% if section.settings.product_description_position == 'bottom' or product.description contains '<!-- split -->' %}
  <div class="clear"></div>

  <div class="full-width-container">
    <div class="row grid_wrapper">
        <div class="mobile-3 {{ lower }}" data-aos="{{ settings.scroll_animation }}">
          <div class="section-title">
            <h3>{{ 'products.product.details' | t }}</h3>
          </div>
          <div class="rte">
            {% if section.settings.product_description_position == 'bottom' %}
            {{ description }}
            {% endif %}
            {% if product.description contains '<!-- split -->' %}
            <br />
            {{ product.description | split: '<!-- split -->' | last }}
            {% endif %}
          </div>
        </div>
    </div>
  </div>
  {% endif %}
  <div class="clear"></div>
  {% if section.settings.enable_product_reviews %}
    <div id="product-reviews" class="{{ lower }} mobile-3">
      <div class="section-title">
        <h3>{{ section.settings.reviews_heading }}</h3>
      </div>
      <div id="shopify-product-reviews" data-id="{{product.id}}" data-aos="{{ settings.scroll_animation }}">
        {{ product.metafields.spr.reviews }}
      </div>
    </div>
    <div class="clear"></div>
  {% endif %}
  {% endif %}

 {% if template != 'product.quick' %}
  {% if section.settings.full_width %}</div>{% endif %}
 {% endif %}
</div>

<style>
  .product-page { position: relative;}
{% if section.settings.product_description_position == 'bottom' or product.description contains '<!-- split -->' %}
.full-width-container {
  background: {{ section.settings.lower_description_background }};
  padding: 40px 0;
  margin-top: 20px;
  margin-bottom: 20px;
}
{% endif %}
{% if section.settings.product_variants == 'swatches' %}
  .selector-wrapper {
    display: none;
  }
  .single-option-selector {
    opacity: 0;
    display: none;
  }
{% endif %}
{% if section.settings.show_quantity_selector %}
  .product-qty.selector-wrapper {
    display: block;
  }
{% endif %}
{% unless section.settings.show_sku %}
      .variant-sku { display: none; }
{% endunless %}
{% if section.settings.image_options == 'static' %}
  #prod-{{ section.id }} .product-photos .vertical-carousel .carousel-nav {
    max-height: calc(133px * {{ section.settings.thumbs_to_show }}) !important;
  }
  {% case section.settings.thumbnail_position %}
    {% when 'below' %}
    #product-{{ product.id }} .thumb-slider-slides {
      transition: left 0.5s ease-in-out;
    }
      .product-thumbnails {
        margin-top: 10px;
        padding: 0 30px;
      }
      .product-thumbnail {
        padding: 10px;
      }
    {% else %}
      #product-{{ product.id }} .thumb-slider-slides {
        transition: top 0.5s ease-in-out;
      }
  {% endcase %}
{% elsif section.settings.image_options == 'scroll' %}
  .product-main-images {
      margin-bottom: -20px! important;
  }
{% endif %}
{% if section.settings.product_description_position != 'below' %}
  .product-description form {
    border-bottom: 0;
    margin-bottom: 0;
  }
  .add {
    margin-bottom: 8px! important;
  }
  {% endif %}
  .product-description {
    background: {{ section.settings.description_background }};
  }
  {% if section.settings.show_banner == false and settings.breadcrumb == false %}
  .product-page { margin-top: 30px; }
  {% endif %}
  @media screen and (max-width: 740px) {
    .share-icons {
      display: inline-block;
      width: 100%;
    }
  }

  {% if template == 'product.quick' %}
    #thumb-slider-wrapper .product-single__thumbnails-item img {
      width: 110px !important;
      height: 110px !important;
    }
    .product-photos .vertical-carousel .carousel-nav {
      max-height: 290px !important;
      height: 290px !important;
    }
  {% endif %}

</style>
<script type="application/json" id="ModelJson-{{ section.id }}">
  {{ product.media | where: 'media_type', 'model' | json }}
</script>
{% schema %}
{
    "name": "Product Page",
    "max_blocks":5,
    "settings": [
      {
        "type": "checkbox",
        "id": "full_width",
        "label": "Full width"
      },
      {
        "type": "checkbox",
        "id": "show_banner",
        "label": "Show banner from collection"
      },
      {
        "type":"header",
        "content":"Media"
      },
      {
        "type": "checkbox",
        "id": "click_to_enlarge",
        "label": "Enable click to enlarge",
        "default": true
      },
      {
        "type": "select",
        "id": "image_section_size",
        "label": "Gallery size",
        "options": [
          {
            "value": "small",
            "label": "Small"
          },
          {
            "value": "medium",
            "label": "Medium"
          },
          {
            "value": "large",
            "label": "Large"
          },
          {
            "value": "ultra",
            "label": "Ultra"
          }
        ],
        "default":"medium"
      },
      {
        "type": "select",
        "id": "image_options",
        "label": "Gallery type",
        "options": [
          {
            "value": "static",
            "label": "Slideshow with thumbnails"
          },
          {
            "value": "scroll",
            "label": "Scroll gallery"
          }
        ]
      },
      {
        "type": "select",
        "id": "thumbnail_position",
        "label": "Thumbnail position when gallery w/thumbnails",
        "options": [
          {
            "value": "right",
            "label": "Right"
          },
          {
            "value": "left",
            "label": "Left"
          },
          {
            "value": "bottom",
            "label": "Bottom"
          }
        ]
      },
      {
        "type": "range",
        "id": "thumbs_to_show",
        "min": 0,
        "max": 6,
        "step": 1,
        "label": "Thumbnail images to show",
        "default": 3,
        "info":"Set to 0 to show a slideshow without thumbnails"
      },
      {
        "type": "select",
        "id": "slide_controls",
        "label": "Slider control style",
        "default": "arrows",
        "options": [
          {
            "value": "arrows",
            "label": "Arrows"
          },
          {
            "value": "dots",
            "label": "Dots"
          }
        ]
      },
      {
        "type": "checkbox",
        "id": "enable_video_looping",
        "label": "Enable video looping",
        "default": false
      },
      {
        "type": "paragraph",
        "content": "Learn more about [Media types](https:\/\/help.shopify.com/en\/manual\/products\/product-media\)"
      },
      {
        "type":"header",
        "content":"Form options"
      },
      {
        "type": "color",
        "id":"description_background",
        "label":"Background color"
      },
      {
        "type": "checkbox",
        "id": "show_vendor",
        "label": "Show vendor"
      },
      {
        "type": "checkbox",
        "id": "show_sku",
        "label": "Show variant SKU",
        "default": true
      },
      {
         "type": "checkbox",
         "id": "show_quantity_selector",
         "label": "Show quantity selector",
         "default": true
       },
       {
          "type": "select",
          "id": "product_variants",
          "label": "Product variant display",
          "options": [
           {
             "value": "swatches",
             "label": "Swatches"
           },
           {
             "value": "drop-downs",
             "label": "Drop-downs"
           }
          ],
          "default": "swatches"
        },
        {
          "type": "select",
          "id": "color_swatch_options",
          "label": "Color swatch style",
          "options": [
            {
              "value": "default-color",
              "label": "Default color"
            },
            {
             "value": "custom-image",
             "label": "Custom uploaded images"
            },
            {
             "value": "variant-image",
             "label": "Zoomed in variant images"
            }
          ],
          "default": "default-color",
          "info": "Learn more about [color swatch styles](https:\/\/support.weareunderground.com\/article\/259-mr-parker-theme-color-swatch-styles)"
        },
        {
          "type": "checkbox",
          "id": "back_in_stock",
          "label": "Show back in stock form",
          "default": true
        },
        {
          "type": "richtext",
          "id": "back_in_stock_text",
          "label": "Back in stock text",
          "default": "<p>Email me when this is available</p>"
        },
       {
         "type": "checkbox",
         "id": "show_payment_button",
         "label": "Show dynamic checkout button",
         "info": "Lets customers check out directly using a familiar payment method. [Learn more](https:\/\/help.shopify.com\/manual\/using-themes\/change-the-layout\/dynamic-checkout)",
         "default": true
       },
       {
         "type": "checkbox",
         "id": "show_social_share",
         "label": "Show social share icons",
         "default": true
       },
       {
         "type":"header",
         "content":"Content options"
       },
       {
         "type": "select",
         "id": "product_description_position",
         "label": "Product description position",
         "options": [
           {
             "value": "above",
             "label": "Above product options"
           },
           {
             "value": "below",
             "label": "Beneath product options"
           },
           {
             "value": "bottom",
             "label": "Below images and options"
           }
         ]
       },
       {
         "type": "select",
         "id": "lower_description",
         "label": "Lower description size",
         "options": [
           {
             "value": "small",
             "label": "Small"
           },
           {
             "value": "medium",
             "label": "Medium"
           },
           {
             "value": "large",
             "label": "Large"
           }
         ]
       },
       {
         "type": "color",
         "id":"lower_description_background",
         "label":"Background color"
       },
       {
          "type": "header",
          "content": "Product Shortcode Popups"
        },
        {
          "type": "paragraph",
          "content": "Use shortcodes in your product description to show links to popups with unique product specific content. [Learn more](https:\/\/support.weareunderground.com\/article\/260-mr-parker-theme-product-shortcode-popups)"
        },
        {
          "type": "checkbox",
          "id": "show_product_size_chart",
          "label": "Show product size",
          "info": "Use shortcode [#size][/size]",
          "default": false
        },
        {
          "type": "checkbox",
          "id": "show_product_video",
          "label": "Show product video",
          "info": "Use shortcode [#video][/video]",
          "default": false
        },
        {
          "type": "checkbox",
          "id": "show_product_model",
          "label": "Show product fit/care",
          "info": "Use shortcode [#other][/other]",
          "default": false
        },
        {
          "type": "header",
          "content": "Product Reviews"
        },
        {
          "type": "paragraph",
          "content": "For reviews to work you must first install the free [Product Reviews](https:\/\/apps.shopify.com\/product-reviews) App by Shopify."
        },
        {
          "type": "checkbox",
          "id": "enable_product_reviews",
          "label": "Enable product reviews",
          "default": false
        },
        {
          "type": "text",
          "id": "reviews_heading",
          "label": "Heading",
          "default": "Customer Reviews"
        }
      ],
    "max_blocks": 5,
    "blocks":[
    {
      "type":"description",
      "name":"Product Description",
      "limit": 1,
      "settings":[]
    },
    {
      "type":"page",
      "name":"Content from Page",
      "settings":[
        {
        "type": "page",
        "id": "page",
        "label": "Show content from"
        }
      ]
    },
    {
      "type":"text",
      "name":"Tab Content",
      "settings":[
        {
          "type": "text",
          "id": "tab_heading",
          "label": "Tab Heading",
          "default": "Tab Heading"
        },
         {
          "type": "richtext",
          "id": "tab_content",
          "label": "Tab Content",
          "default": "<p>Enter the content to use inside the tab selected.</p>"
        }
    	]
    }
  ],
  "default": {
    "blocks": [
      {
        "type": "description"
      },
      {
        "type": "text"
      }
    ]
  }
}
{% endschema %}

{% if product.metafields.loox.num_reviews %}
<script id="looxSchemaJson" type="application/ld+json">
{
	"@context": "http://schema.org",
	"@type": "Product",
	"@id": {{ canonical_url | json }},
	"aggregateRating": {
		"@type": "AggregateRating",
		"ratingValue": "{{ product.metafields.loox.avg_rating }}",
		"reviewCount": "{{ product.metafields.loox.num_reviews }}"
	},
	"name": {{ product.title | json }}
}
</script>
{% endif %}


	<div id="looxReviews" data-product-id="{{product.id}}" class="loox-reviews-default">{{ product.metafields.loox.reviews }}</div>

I've tried adding the portion at the very top with 

value="{{ variant.id }}">	
                    {{ variant.title }}

This has helped me fix a similar solution in the past but I just don't know what's wrong this time, as I can't figure it out. Any help would be greatly appreciated! 

Thanks a lot! 

[Greg_Kujawa]

This seems to have been discussed here, so you are on the right track... https://community.shopify.com/c/Shopify-Design/Required-parameter-missing-or-invalid-items/td-p/6231... 

[Peyamirfani]

I have faced the same issue in Dawn theme and tried this solution. But it does not work. 

Any idea how solve it?