Wrong Variants adding to Cart

Highlighted
New Member
1 0 0

So I just launched my store today and I'm only getting orders for the first variant for my shirts, which is a medium. Whenever they click on Large, or XL, I get the order as a medium on my end. I did a test order for an XL and it worked for me, so I guess it only happens sometimes. The only apps I have installed are Pirate Ship and MailChimp. PLEASE HELP!! 

 

My store is jnglcollective.com 

 

My theme code is as follows:

 

<!doctype html>
<html class="no-js" lang="{{ shop.locale }}">
<head>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">

<meta name="theme-color" content="{{ settings.color_nav_bg }}">

{% if settings.favicon %}
<link rel="shortcut icon" href="{{ settings.favicon | img_url: '32x32' }}" type="image/png" />
{% endif %}

<link rel="canonical" href="{{ canonical_url }}">

<title>
{{ page_title }}{% if current_tags %}{% assign meta_tags = current_tags | join: ', ' %} &ndash; {{ 'general.meta.tags' | t: tags: meta_tags }}{% endif %}{% if current_page != 1 %} &ndash; {{ 'general.meta.page' | t: page: current_page }}{% endif %}{% unless page_title contains shop.name %} &ndash; {{ shop.name }}{% endunless %}
</title>

{% if page_description %}
<meta name="description" content="{{ page_description | escape }}">
{% endif %}

{% include 'social-meta-tags' %}

{{ 'theme.scss.css' | asset_url | stylesheet_tag }}

<script>
window.theme = window.theme || {};
theme.strings = {
cartEmpty: {{ 'cart.general.empty' | t | json }},
savingHtml: {{ 'cart.general.savings_html' | t: price: '[savings]' | json }},
addToCart: {{ 'products.product.add_to_cart' | t | json }},
soldOut: {{ 'products.product.sold_out' | t | json }},
unavailable: {{ 'products.product.unavailable' | t | json }},
addressError: {{ 'map.address_error' | t | json }},
addressNoResults: {{ 'map.address_no_results' | t | json }},
addressQueryLimit: {{ 'map.address_query_limit_html' | t | json }},
authError: {{ 'map.auth_error_html' | t | json }}
};
theme.settings = {
cartType: {{ settings.cart_type | json }},
moneyFormat: {{ shop.money_format | json }}
};
</script>

<script src="{{ 'lazysizes.min.js' | asset_url }}" async="async"></script>

{% if template.directory == 'customers' %}
<script src="{{ 'shopify_common.js' | shopify_asset_url }}" defer="defer"></script>
{% endif %}

<script src="{{ 'vendor.js' | asset_url }}" defer="defer"></script>

<script src="{{ 'option_selection.js' | shopify_asset_url }}" defer="defer"></script>

<script src="{{ 'theme.js' | asset_url }}" defer="defer"></script>

{{ content_for_header }}

</head>

<body id="{{ page_title | handle }}" class="{% if customer %}customer-logged-in {% endif %}template-{{ template | replace: '.', ' ' | truncatewords: 1, '' | handle }}" >
<div id="SearchDrawer" class="search-bar drawer drawer--top">
<div class="search-bar__table">
<form action="/search" method="get" class="search-bar__table-cell search-bar__form" role="search">
<div class="search-bar__table">
<div class="search-bar__table-cell search-bar__icon-cell">
<button type="submit" class="search-bar__icon-button search-bar__submit">
<span class="icon icon-search" aria-hidden="true"></span>
<span class="icon__fallback-text">{{ 'general.search.submit' | t }}</span>
</button>
</div>
<div class="search-bar__table-cell">
<input type="search" id="SearchInput" name="q" value="{{ search.terms | escape }}" placeholder="{{ 'general.search.placeholder' | t }}" aria-label="{{ 'general.search.placeholder' | t }}" class="search-bar__input">
</div>
</div>
</form>
<div class="search-bar__table-cell text-right">
<button type="button" class="search-bar__icon-button search-bar__close js-drawer-close">
<span class="icon icon-x" aria-hidden="true"></span>
<span class="icon__fallback-text">{{ 'general.search.close_search' | t }}</span>
</button>
</div>
</div>
</div>
<div id="NavDrawer" class="drawer drawer--left">
{% section 'sidebar-menu' %}
</div>
<div id="CartDrawer" class="drawer drawer--right drawer--has-fixed-footer">
<div class="drawer__header">
<div class="drawer__close">
<button type="button" class="drawer__close-button js-drawer-close">
<span class="icon icon-x" aria-hidden="true"></span>
<span class="icon__fallback-text">{{ 'cart.general.close_cart' | t }}</span>
</button>
</div>
</div>
<div class="drawer__inner">
<div id="CartContainer">
</div>
</div>
</div>

<div id="PageContainer">
{% section 'announcement-bar' %}

{% unless template.name == "index" %}
<div class="site-header-wrapper">
<div class="site-header-container">
{% section 'header' %}

<div class="action-area">
{% unless template.name == 'product' or template.name == 'search' or template.name == 'index' %}
{% include 'action-bar' %}
{% endunless %}

{% if template.name == 'search' and search.performed %}
<div class="action-bar">
<div class="search__results-count">
{{ 'general.search.results_with_count' | t: count: search.results_count, term: search.terms }}
</div>
</div>
{% endif %}
</div>
</div>
</div>
{% endunless %}

<main class="main-content{% if template.name == blank %} main-content--no-template{% endif %}" role="main">
{{ content_for_layout }}
</main>

{% section 'footer' %}

</div>

{% comment %}
Enable ajax cart drawer
{% endcomment %}
{% if settings.cart_type == 'drawer' %}
<script id="CartTemplate" type="text/template">
{% raw %}
<form action="/cart" method="post" novalidate class="cart ajaxcart">
<div class="ajaxcart__inner ajaxcart__inner--has-fixed-footer">
{{#items}}
<div class="ajaxcart__row">
<div class="ajaxcart__product" data-line="{{line}}">
<div class="grid grid--half-gutters">
<div class="grid__item one-quarter">
<a href="{{url}}" class="ajaxcart__product-image"><img src="{{img}}" alt="{{name}}"></a>
</div>
<div class="grid__item three-quarters">
<div class="ajaxcart__product-name-wrapper">
<a href="{{url}}" class="ajaxcart__product-name h4">{{name}}</a>
{{#if variation}}
<span class="ajaxcart__product-meta">{{variation}}</span>
{{/if}}
{{#properties}}
{{#each this}}
{{#if this}}
<span class="ajaxcart__product-meta">{{@key}}: {{this}}</span>
{{/if}}
{{/each}}
{{/properties}}
</div>

<div class="grid grid--table">
<div class="grid__item one-half">
<div class="ajaxcart__qty">
<button type="button" class="ajaxcart__qty-adjust ajaxcart__qty--minus" data-id="{{key}}" data-qty="{{itemMinus}}" data-line="{{line}}" aria-label="{% endraw %}{{ 'cart.label.reduce_quantity' | t }}{% raw %}">
<span class="icon icon-minus" aria-hidden="true"></span>
<span class="icon__fallback-text" aria-hidden="true">&minus;</span>
</button>
<input type="text" name="updates[]" class="ajaxcart__qty-num" value="{{itemQty}}" min="0" data-id="{{key}}" data-line="{{line}}" aria-label="quantity" pattern="[0-9]*">
<button type="button" class="ajaxcart__qty-adjust ajaxcart__qty--plus" data-id="{{key}}" data-line="{{line}}" data-qty="{{itemAdd}}" aria-label="{% endraw %}{{ 'cart.label.increase_quantity' | t }}{% raw %}">
<span class="icon icon-plus" aria-hidden="true"></span>
<span class="icon__fallback-text" aria-hidden="true">+</span>
</button>
</div>
</div>
<div class="grid__item one-half text-right">
{{#if discountsApplied}}
<small class="ajaxcart-item__price-strikethrough"><s>{{{originalLinePrice}}}</s></small>
<br><span>{{{linePrice}}}</span>
{{else}}
<span>{{{linePrice}}}</span>
{{/if}}
</div>
</div>
{{#if discountsApplied}}
<div class="grid grid--table">
<div class="grid__item text-right">
{{#each discounts}}
<small class="ajaxcart-item__discount">{{ this.title }}</small><br>
{{/each}}
</div>
</div>
{{/if}}
</div>
</div>
</div>
</div>
{{/items}}

{% endraw %}{% if settings.cart_notes_enable %}{% raw %}
<div class="ajaxcart__row">
<label for="CartSpecialInstructions" class="txt--minor">{% endraw %}{{ 'cart.general.note' | t }}{% raw %}</label>
<textarea name="note" class="input-full ajaxcart__note" id="CartSpecialInstructions">{{note}}</textarea>
</div>
{% endraw %}{% endif %}{% raw %}
</div>
<div class="ajaxcart__footer ajaxcart__footer--fixed">
<div class="ajaxcart__subtotal">
<div class="grid grid--table">
<div class="grid__item two-thirds">
<span class="ajaxcart__subtotal-title h3">{% endraw %}{{ 'cart.general.subtotal' | t }}{% raw %}</span>
</div>
<div class="grid__item one-third text-right">
<span>{{{totalPrice}}}</span>
</div>
</div>
{{#if totalCartDiscountApplied}}
<p class="ajaxcart__savings text-center"><em>{{{totalCartDiscount}}}</em></p>
{{/if}}
</div>

<p class="text-center ajaxcart__policies txt--minor rte">{% endraw %}
{%- capture taxes_shipping_checkout -%}
{%- if shop.taxes_included and shop.shipping_policy.body != blank -%}
{{ 'cart.general.taxes_included_and_shipping_policy_html' | t: link: shop.shipping_policy.url }}
{%- elsif shop.taxes_included -%}
{{ 'cart.general.taxes_included_but_shipping_at_checkout' | t }}
{%- elsif shop.shipping_policy.body != blank -%}
{{ 'cart.general.taxes_and_shipping_policy_at_checkout_html' | t: link: shop.shipping_policy.url }}
{%- else -%}
{{ 'cart.general.taxes_and_shipping_at_checkout' | t }}
{%- endif -%}
{%- endcapture -%}
{{ taxes_shipping_checkout }}
{% raw %}</p>
<button type="submit" class="btn btn--full cart__checkout" name="checkout">
{% endraw %}{{ 'cart.general.checkout' | t }}{% raw %}
</button>
</div>
</form>
{% endraw %}
</script>
<script id="JsQty" type="text/template">
{% raw %}
<div class="js-qty">
<button type="button" class="js-qty__adjust js-qty__adjust--minus" data-id="{{key}}" data-qty="{{itemMinus}}" aria-label="{% endraw %}{{ 'cart.label.reduce_quantity' | t }}{% raw %}">
<span class="icon icon-minus" aria-hidden="true"></span>
<span class="icon__fallback-text" aria-hidden="true">&minus;</span>
</button>
<input type="text" class="js-qty__num" value="{{itemQty}}" min="1" data-id="{{key}}" aria-label="quantity" pattern="[0-9]*" name="{{inputName}}" id="{{inputId}}">
<button type="button" class="js-qty__adjust js-qty__adjust--plus" data-id="{{key}}" data-qty="{{itemAdd}}" aria-label="{% endraw %}{{ 'cart.label.increase_quantity' | t }}{% raw %}">
<span class="icon icon-plus" aria-hidden="true"></span>
<span class="icon__fallback-text" aria-hidden="true">+</span>
</button>
</div>
{% endraw %}
</script>

{% endif %}

</body>
</html>

 

My product liquid is:

 

{% comment %}
The contents of the product.liquid template can be found in /sections/product-template.liquid
{% endcomment %}

{% section 'product-template' %}

<script>
// Override default values of theme.strings for each template.
// Alternate product templates can change values of
// add to cart button, sold out, and unavailable states here.
window.productStrings = {
addToCart: {{ 'products.product.add_to_cart' | t | json }},
soldOut: {{ 'products.product.sold_out' | t | json }}
}
</script>

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1220 120 308

Hey there, Henry!

 

Bo here from Shopify Support.

 

Congratulations on launching your store, your page looks absolutely amazing. I took a look at your code and it looks to be an unedited version of Boundless, everything here looks totally fine. I also went ahead and tried to replicate the problem to no avail, the checkout allowed me to check out with an XL and an L shirt with no problem at all. Was this something that was reported to you by more than one customer? Have customers been able to check out with other variants since? 

 

If this issue persists I would love to get it looked at by our technical team. To do so I just need to authenticate you as the account owner. Could you e-mail me at support@shopify.com from the e-mail you use to log in and get back to me on this thread with the reference number that is generated or the e-mail used so that I can authenticate you as the owner? I can then take a look at your account from our side.

 

While I'm sure you've got this covered I just wanted to share our guide on setting up a successful t-shirt printing business which can be found here. 

 

All the Best,

Bo

Bo - Social Care @ Shopify


Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution
To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
Highlighted
New Member
1 0 1

Hi There

 

I'm having issues with customers adding a variant to cart, and the wrong variant is being added.

 

I suspect it has something to do with my java script, which I have no clue about. It seems to not be refreshing, and adding the default product to cart. Furthermore, the amount of stock available is also reverting to default.

 

Any assistance would be great.

 

My website is www.radbeachwear.com

 

Ant

1 Like