Install instructions
Step 1
Follow our Online store 2.0 article to enable the Store Pickup + Delivery widget, but don't publish the duplicate theme 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
- This step will make sure our widget is clickable.
Open assets/ajaxify-shop.js.liquid and search for the following:
<span class="money total-price">'+totalPriceConverted+'</span></li></ul></div>';
Append the code below to that line:
subtotalRow += '<div id="storePickupApp"></div>';
Step 3
- This step will make sure our widget is consistent in the modal cart.
Open assets/ajaxify-shop.js.liquid and search for the following:
if (window.Shopify && Shopify.StorefrontExpressButtons) {Prepend the code below to that line:
document.dispatchEvent(new CustomEvent("zapiet:start"));Step 4
- This step will hide our ZapietID from the modal cart.
Open assets/ajaxify-shop.js.liquid and search for the following:
propertiesText=propertiesText+key+": "+value+"<br/>"
Replace the code above with the line below:
if (key != "_ZapietId") { propertiesText=propertiesText+key+": "+value+"<br/>" }Step 5
- This step will make sure our widget shows in the cart page.
Open templates/cart.liquid and search for the following:
<div class="cart_btn clearfix">
Append the following code to that line:
<div id="storePickupApp"></div>
Step 6
- This step will hide our ZapietID from the cart page.
Open templates/cart.liquid and search for the following:
{% unless p.last == blank %}Replace the code above with the following line:
{% unless p.last == blank or p.first == "_ZapietId" %}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.
- In the cart page
- In the modal cart
