Install instructions

Step 1

Follow our Online store 2.0 article to enable the Store Pickup + Delivery widget, but don't publish the duplicate before implementing the rest of the steps.

Note

Please reach out to us at [email protected]—we’ll be happy to install the widget for you.

Only proceed if you are comfortable editing code yourself.

On the theme, click Actions > Edit code.

Step 2

Open layout/theme.liquid and find the following code:

document.documentElement.dispatchEvent(new CustomEvent('cart:refresh', {
bubbles: true
}));

HTML

Replace the code above with the following:

// document.documentElement.dispatchEvent(new CustomEvent('cart:refresh', {
// bubbles: true
// }));

HTML

Step 3

  • This and the following step make sure the widget is persistent and that it reloads when the quantity is changed.

Open layout/theme.liquid and find the following code:

theme.min.js

JavaScript

Replace the code above with the following:

theme.js

JavaScript

It should look similar to the screenshot below:

Step 4

Open assets/theme.js and search for the following:

item.textContent = _this36.itemCount; });

JavaScript

If you cannot locate this file, it may be due to a different number on your theme (e.g. this38). Try searching for the following instead:

item.textContent = _this

HTML

Append the following code to the line above:

document.dispatchEvent(new CustomEvent("zapiet:start"));

JavaScript

It should look similar to the screenshot below:

If you are using a drawer cart, there is one additional step needed:

Step 4

  • This step redirects the checkout button from the drawer cart to the regular cart so our app will not be bypassed.

Open snippets/cart-drawer.liquid and search for the following:

name="checkout"

HTML

Replace the code above with the following:

name="cart"

HTML

Our app cannot show in the drawer cart on this theme.


The widget should appear on the cart page when you have added a product in the cart.

It should look similar to the screenshot below.

Did this answer your question?