Getting your SDK Key

To get an API key, book a meeting with us and sign the license agreement. Book a meeting by visiting here.

Menu SDK

Implementation steps

1. importing the script

<script src="https://sdk.mealme.ai/script.js" defer></script>

2. Show popup modal

For example:

mealme.showMenuModal("YOUR_NAME", {
        storeId: "STORE_ID",
        menuId"MENU_ID",
      });

Full HTML example

<html>
  <script src="https://sdk.mealme.ai/script.js"></script>
  <script>
    const onClickButton = () => {
      window.mealme.showMenuModal("YOUR_NAME", {
        storeId: "STORE_ID",
        menuId"MENU_ID",
      });
    };
  </script>
  <button
    onClick="onClickButton()"
    style="
      border: none;
      border-radius: 8px;
      color: #ffffff;
      background: #ff9b04;
      padding-block: 12px;
      padding-inline: 18px;
      font-size: 14px;
      font-weight: 600;
    "
  >
    Order now
  </button>
</html>

Example using customizations:

Closing the modal popup

If you want to programmatically close the modal for another reason you can use:

window.mealme.closeModal()

Capturing events

We fire events that you can catch if you want to read the data.

The events fired from the menu SDK checkout flow are the following:

Checkout success
Checkout failure

If you want to capture events while having the SDK in an App, please follow these instructions, instead of the web examples given below.

Checkout success event

Code to capture success event

window.onmessage = (event) => {
  if (event.data.id === "mealme-checkout-success") {
    // Your code using event.data
  }
};

Example data for success event:

{
  success: true,
  orderId: "123",
  items: [
    {
      product_id: "gAAA",
      item_name: "NESCAFÉ Dark Roast Instant Coffee",
      image: "https://cdn-img.mealme.ai/...",
      description: "",
      category: "Coffee",
      price: 1299,
      formatted_price: "$12.99",
      upc_codes: [],
      unit_size: 10.5,
      unit_of_measurement: "oz",
      should_fetch_customizations: true,
    },
    {
      product_id: "gAAAA",
      item_name: "Lactaid Whole Milk",
      image: "https://cdn-img.mealme.ai/...",
      description: "",
      category: "Milk",
      price: 579,
      formatted_price: "$5.79",
      upc_codes: [],
      unit_size: 0.5,
      unit_of_measurement: "gal",
      should_fetch_customizations: true,
    },
  ],
  trackingLink: "https://tracking.mealme.ai/tracking?tracking_id=123",
};

Checkout fail event

Code to capture fail event

window.onmessage = (event) => {
  if (event.data.id === "mealme-checkout-fail") {
    // Your code using event.data
  }
};

Example data for success event:

{
  success: false,
  message: "Something went wrong",
}