NOTE
This is a known issue with Shopify. Our dev team is looking for a better solution to this problem but it's a quite challenging technical issue, considering Shopify’s variant restrictions.

Description of the issue

You have added your product to the cart but the pricing is not properly displayed. The pricing is 0 or "free".
After refreshing the page, the correct price is displayed.
When the customer clicks on the Check Out button, the correct price is displayed.

Why is this happening?

Since there is a 100 variant limit with Shopify, Kickflip dynamically creates variants for each pricing variation of your product.

Sometimes, there is a delay connecting with the Shopify API and the Cart is displayed before the Shopify API creates the correct variant. Therefore the displayed pricing of 0 or 'free'.

How to fix it

We have created a script that will work for many themes but not all of them. Since there are thousands of different Shopify themes, it's impossible to create a script that will work for all themes.

Log in to Kickflip.
Go to Settings > Online stores.
Click on your Shopify online store.
Under Shopify themes settings, click on the Update Cart button.

What if the 'Update Cart' script does not work?

Option 1 : Manually updating your cart template

If an error occurred when you tried to click on the Update cart button or the cart seems to be missing some items (images, etc), you can manually update your cart template. Here are the steps:

Make sure you have run the “Update Cart” script
To verify this, you can go to your Shopify Theme > Action > Edit Code page and make sure the customize-button.mczr.liquid is present in the folder “Snippets”.
Update the cart footer (if your theme has one)
Check if your theme has a cart footer file. This file is typically named main-cart-footer.liquid or cart-footer.liquid and will be in the “Sections” folder. Note that not all Shopify themes have this file. If this file is present:
1. Check if there is a line where the cart.total_price is displayed and if so, add the data-mczr="cart_total_price" attribute. For example:
 
 Before:
```

 {{ cart.total_price | money_with_currency }}

```
 After:
```

 {{ cart.total_price | money_with_currency }}

```
2. Check if there is a line where the items_subtotal_price is displayed and if so, add the data-mczr="cart_items_subtotal_price" attribute. For example:
 
 Before:
```
 
{{ cart.items_subtotal_price | money_with_currency }}
 
```
 After:
```
 
{{ cart.items_subtotal_price | money_with_currency }}

```
Update the cart template

Locate your liquid cart template. It will probably be something like templates/cart.liquid, sections/main-cart-items.liquid or sections/cart-items.liquid.
1. Locate the item rendering “for loop”. It will be something like:
 {%- for item in cart.items -%} or {%- for product in cart.items -%}.
 
 The word after the "for" is what we call the item identifier (item or product for example). In the following steps, you will have to replace the keyword ITEM_IDENTIFIER with your own item identifier.
2. Add the following attribute to the tag directly below the “for loop”:
 data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item-not-mczr{% endif %}"
 
 For example:
 
 Before:
```
{%- for ITEM_IDENTIFIER in cart.items -%}<tr id="CartItem-{{ ITEM_IDENTIFIER.index | plus: 1 }}">
```
 After:
```
{%- for ITEM_IDENTIFIER in cart.items -%}<tr id="CartItem-{{ ITEM_IDENTIFIER.index | plus: 1 }}" data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item-not-mczr{% endif %}">
```
3. For all properties found in your cart template, add the associated attribute:

Property in code	Attribute to add
line_price	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_final_line_price-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_final_line_price-not-mczr{% endif %}"`
final_line_price	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_final_line_price-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_final_line_price-not-mczr{% endif %}"`
final_price	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_final_price-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_final_price-not-mczr{% endif %}"`
price	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_final_price-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_final_price-not-mczr{% endif %}"`
original_line_price	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_original_line_price-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_original_line_price-not-mczr{% endif %}"`
original_price	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_original_price-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_original_price-not-mczr{% endif %}"`
product.title	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_product_title-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_product_title-not-mczr{% endif %}"`
variant.title	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_variant_title-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_variant_title-not-mczr{% endif %}"`
img_url	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_image-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_image-not-mczr{% endif %}"`
image_url	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_image-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_image-not-mczr{% endif %}"`
product_img_url	`data-mczr="{% if ITEM_IDENTIFIER.properties._mczr_designId %}item_image-{{ ITEM_IDENTIFIER.properties._mczr_designId }}{% else %}item_image-not-mczr{% endif %}"`

d. At the end of the cart template, add the following line to include the Kickflip cart script:

{% render "cart-script.mczr" %}

You should be ready to rock now!

Option 2 : Manually add to cart every variant

If all else fails, we recommend opening your customizer in your store and manually adding to cart every pricing variation. Once a pricing variant is added to cart, the '0$' problem does not happen again for that variant.

For example :

T-Shirt Base Price : $10

Size XL : +$5

Tie Die Option : +$1

Embroidery Option: +$2

Product combinations you should add to your cart :

T-Shirt of any other size than XL ($10)
T-Shirt + XL size ($15)
T-Shirt + XL size + Tie Die Option ( $16)
T-Shirt + XL size + Tie Die Option + Embroidery Option ( $18)
T-Shirt + XL size + Embroidery Option ($17)
T-Shirt of any other size than XL + Tie Die Option ($11)
...

Setting up your Shopify cart page