Liquid, JavaScript, themes, sales channels
To continue receiving payouts, you need to secure your account by turning on two-step authentication. If two-step authentication is not turned on your payouts will be paused. Learn more
I am using the theme Narrative and added 3 variable to my product page - size, bottom and sleeve. As well as custom coded 4 variables.
When choosing my variables and adding them to cart, my cart doesn't reflect my selections. What I see in the checkout page is, the default selection - XS, Harem, Basic even when I changed those selections and add them to cart.
Does anyone know why this would happen?
This is what my cart.liquid looks like:
{% comment %}
The contents of the cart.liquid template can be found in /sections/cart-template/
{% endcomment %}
{% section 'cart-template' %}
Solved! Go to the solution
This is an accepted solution.
Hi @ellylla,
Please remove 'data-option-input' for properties, it will work fine: https://i.imgur.com/XjmrDZB.png
Hope it helps!
Hi @ellylla,
Please send your site and if your site is password protected, please send me the password. I will check it for you.
Hi - I'd really appreciate that! The page is: https://wearellylla.com/products/evolve-top-set. When I change the variables, it's not reflected in the checkout.
Another note, is I created a custom section for this product page with this extra code:
<div class="product-form__item">
<label class = "single-option-selector__label" for "top color">Top Color
</label><br>
<select id="top-colour" name="properties[Top Colour]" class="single-option-selector" data-option-input="padding-left: 71.9219px; opacity: 1;">
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</div>
<div class="product-form__item">
<label class = "single-option-selector__label" for "sleeve color">
Sleeve Color
</label>
<select id="sleeve-colour" name="properties[Sleeve Colour]" class="single-option-selector" data-option-input="padding-left: 71.9219px; opacity: 1;">
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</div>
<div class="product-form__item">
<label class = "single-option-selector__label" for "sleeves">Sleeve Extension Color</label><br>
<select class="single-option-selector" data-option-input="padding-left: 71.9219px; opacity: 1;" id="sleeve-extension-color" name="properties[Sleeve Extension Color]">
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</div>
<div class="product-form__item">
<label class = "single-option-selector__label" for "sleeves">Bottom Color</label><br>
<select class="single-option-selector" data-option-input="padding-left: 71.9219px; opacity: 1;" id="bottom-color" name="properties[Bottom Color]">
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</div>
I am assuming that this is why it's not working because when I use another product template, the variables reflect.
Thanks so much!
This is an accepted solution.
Hi @ellylla,
Please remove 'data-option-input' for properties, it will work fine: https://i.imgur.com/XjmrDZB.png
Hope it helps!
Yes! It works! Thanks so much for the help 🙂
@LitCommerceI am having a similar problem but I can't figure out why. Would you be able to help me? I am using Debut Theme on this website: https://tartar-berlin.com. Thank you so much!
Learn these 5 things I had to learn the hard way with starting and running my own business
By Kitana Jan 27, 2023Would you love to unleash the unbridled power of the Google Shopping Channel into your sho...
By Gabe Jan 6, 2023How can you turn a hobby into a career? That’s what Emmanuel did while working as a wa...
By Skye Dec 30, 2022