Liquid, JavaScript, themes, sales channels
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!
User | RANK |
---|---|
21 | |
21 | |
9 | |
7 | |
6 |
Explore the 30-30-30 rule, a dynamic social media strategy for new businesses. Learn how t...
By Trevor Sep 20, 2023Discover how to leverage the often overlooked footer of your ecommerce site to gain custom...
By Skye Sep 15, 2023In this blog, we’ll be shining a light on Shopify Partners, Experts, and Affiliates. Who a...
By Imogen Sep 13, 2023