Foodie setup instructions

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.


Please reach out to us at—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 snippets/cart-form.liquid and search for the following:

{% unless p.last == blank %}

Replace the line above with the following code: 

{% unless p.last == blank or p.first == "_ZapietId" %}

Step 3

  • This step will make sure our widget is consistent in both carts.

Open layout/theme.liquid and add the code below at the bottom of that file:

<!-- Start of Zapiet code -->
<script type="text/javascript">
  document.addEventListener("DOMContentLoaded", function() {
    // Update first item's key in the theme when widget changes it's properties
    ZapietEvent.listen("checkoutEnabled", function() {
      WAU.ThemeCart.getCart().then(function(updatedCart) {
        var keyElements = document.querySelectorAll("[data-item-key]");

        // Case: empty cart
        if (!updatedCart.items 
            || updatedCart.items.length == 0
            || !keyElements
            || keyElements.length == 0
           ) {

        // Grab the first item's key in the theme
        var themeKey = keyElements[0].getAttribute("data-item-key");

        // Grab the first item's key in the cart
        var updatedKey = updatedCart.items[0].key;

        // Case: No keys to update
        if (themeKey == updatedKey) {

        // Update the key
          .querySelectorAll("[data-item-key='" + themeKey + "']")
          .forEach(function(element) {
              element.setAttribute("data-item-key", updatedKey);
    // Reload app when theme updates the view
    setInterval(function() {
      var zapietDiv = document.getElementById("storePickupApp");
      if (!zapietDiv) {
        document.dispatchEvent(new CustomEvent("zapiet:start"))
    }, 1000);
<!-- End of Zapiet code -->


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 regular cart

  • In the drawer cart


Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.