1. Open Shopify admin.
2. Go to ONLINE STORE.
3. Click Themes.
4. Click Edit HTML/CSS.



5. Open cart.liquid page in the Templates section of your current Shopify store theme.
6. Search for the code line {% for item in cart.items %} in the file (cart.liquid) and add the following block of code after that line.

7. Replace the first existence of <div class="cart__row"> with <div class="cart__row" data-line="{{ forloop.index }}">.

{% assign ref_id = "0" %}
{% for p in item.properties %}
{% assign pfirst_char = p.first | slice: 0 %}
{% if pfirst_char == "_" %}
{% if p.first == "_refid" %}
{% assign ref_id = p.last %}
{% endif %}
{% endif %}
{% endfor %}
 

Note: The line <div class="cart__row"> may appear multiple times in the file. In that case, you need to do changes where it appears for the first time.
The name "cart__row" may vary in few themes. In such case, look for closely related div and make the changes.
If you are a Developer then " <div class="cart__row"> " is the div tat, which contains all items of the cart.

8. Remove the first occurrence of "<div class="grid">" div and its corresponding closing tag. </div>
Note: In some themes, the class name may appear multiple times. Here too, you need to delete the div where it first appears.



9. Search for the following block of code.

<div class="grid__item one-third">
<a href="{{ item.url | within: collections.all }}" class="cart__image">
{% comment %}
More image size options at:
- http://docs.shopify.com/themes/filters/product-img-url
{% endcomment %}
<img src="{{ item | img_url: 'medium' }}" alt="{{ item.title | escape }}">
</a>
</div>



and replace with code block given below

<div class="grid-item six-eighths">
{% if ref_id != "0" %}
<span class="loading"> </span>
<ul class="ref-preview-img custom_loading" data-ref-id="{{ref_id}}"> </ul>
{% else %}
<a href="{{ item.url }}" class="cart-image">
<img src="{{ item | img_url: 'medium' }}" alt="{{ item.title | escape }}">
</a>
{% endif %}

</div>

10. Remove the line {% if propertySize > 0 %}  and its corresponding closing tag {% endif %}.



11. Click Save.
12. Open product.liquid file in the Templates section of your current theme.
13. Find for the word "AddToCart" and make sure you reach the Add To Cart button with following code.

<button type="submit" name="add" id="AddToCart" class="btn" >
In some cases when you don't see the "AddToCart" button in your code then search for "addToCart" or "addtocart". This depends on the way it exists in your theme.
In some cases "AddToCart" button would be in <input type="Button" format.
After the closing Tag of AddToCart Button and before </form>, add the following line.

{% include 'customizeButton' %}

14. Add the line {% include 'xe_script' %} at the end of the file.



15. Click Save.
16. Open Theme.liquid file in the Layout section of your current theme.
17. Towards the end of the file, look for the closing tag of the Body. () and add the line {% include 'xe_include' %} before tag.

19. Click Save.