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:;"><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:;">{{ '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:;"><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:;"><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!
Shopify Discussion
Partners and Developers
Ollie
Jul 28, 2022
