Cart edit button
To setup the edit button in the app visit the following help documentation: How can I add an edit button on the cart page?
Automatic
When the cart edit button setting is enabled, the app will try to automatically add an edit button just above the remove link:
Manual
If you theme already has an edit button on the cart page or if you want to create your own edit button, then you can use the following selector to let the app turn it into an edit button:
Selector | Example |
---|---|
[data-live-item-edit] | data-live-item-edit="" |
In your theme, find the cart liquid and look for your edit button:
<button class="btn btn-edit" data-live-item-edit="">Edit</button>
Add the attribute data-live-item-edit to the button element.
Link
The edit button is just a link with the &item={{ item.key }} url parameter. To always default to edit the cart item, you can update all links on the cart:
<a href="{{ item.url }}&item={{ item.key }}"> {{ item.product.title }} </a>
Update cart navigation
When the cart item is updated instead of added as a new item, the app takes over the add to cart and then navigates to the "/cart" url. If you want to avoid the cart navigation and instead handle the cart update directly on your theme in order to open the cart drawer, you can add the following global event handler on your theme:
<script> window.clOnCartUpdate = () => { // rebuild cart (Impusle theme api) document.dispatchEvent(new CustomEvent('cart:build')); // open cart drawer document.querySelector('.js-drawer-open-cart').click(); } </script>