Articles in this section

See more

Building the Food Ordering Feature

Teague James
  • Updated
Follow

Overview

The Food Ordering feature is a simple way for delis and restaurants to take orders through an app. It provides an ordering tool that makes delivery, takeout, and dining-in extremely convenient.

With food order delivery, takeout/pick-up options, online payment, transaction information history, a customizable menu with add-ons and pricing options, you have full control over the functionality provided to the user.

You can check a quick overview in the video below:

 Back to top

Solution

Adding the Feature

Navigate to the Build tab to begin the setup process, then follow the steps below.

  1. Go to Create > Build, then click +Add.

    mceclip11.png

  2. Choose the Food Ordering feature from the menu, then click Select.

    mceclip10.png

  3. Name your feature, then click Add. Your new feature will now appear in the left-side menu.

  4. Click on the feature to expand its menu. From the left-side menu, you can:

    • Use the checkbox to delete the feature.

    • Click and drag the arrow icon to rearrange.

    • Edit the feature icon by clicking it, then selecting a new image from the fly-up menu.

    • Toggle the feature on/off.

    • Jump to a specific section (i.e., Content or Custom Design) to adjust the feature settings.

Back to top

Screen Info

  1. Under Screen Info, change your Screen/Feature Name or leave as-is. This is the name that will appear in the app's feature menu (e.g., 'Menu' as opposed to 'Ordering')

  2. To change the Feature's Icon, click the Edit button and select an image from your Library
    mceclip0.png

Ordering Service: Embedding a Third-Party Ordering Service

  1. Click on the icon of the third-party Ordering Service you would like to embed in your app
    Note: BiznessApps currently only supports MyCheck, iMenu360, olo, Eat24 (now part of GrubHub), GrubHub, Seamless, and Onosys by embedding their menu and ordering service in your app as an iFrame. All transactions and content are handled by and come from the third-party application. If you want to use a service that is not currently supported you can open a ticket to request a new feature or custom build from our Professional Services team.

  2. Enter the URL of your third-party Ordering Service that leads directly to your shop or menu

  3. Click the Save button

Your selected third-party Ordering Service will appear in your app's Food Ordering section as an embedded iFrame. Note: You will not be able to preview this using the App Preview in the BisnessApps Build screen. Instead, you will need to use the Native Preview feature to preview this feature.

 mceclip2.png

 

Ordering Service: Create a Custom Ordering Service

Build your own Custom Ordering Service in which orders and payments are processed in your BiznessApps app. You will need to have a Payment Gateway configured if you want to process credit card payments. See the Signing up for a Payment Gateway article for more information. 

  1. Click the Custom icon
    mceclip1.png

  2. Under Ordering Services, click Locations, then Add New Location. Repeat this process for each Location required. 

    mceclip0.png

    You will be presented with the following options to configure:

    • Address Section 1 and Address Section 2 (requires Hazel or later)
      Use these fields to name your location as you wish. They will serve as the top and bottom lines of the location name.

    • Website
      Enter the URL for the restaurant’s website. This must start with the "http://” prefix. If the client or business does not have an official website, a Yelp or Facebook page will work just as well.

    • Email
      Input a valid email address for this restaurant. When users click the one-touch Email button, this email address will be auto-populated in the To: field.

    • Telephone
      Input a valid phone number for this restaurant. When users click the one-touch Call button, this is the phone number it will dial.

    • Opening Times 
      Click ADD OPENING TIMES to select the restaurant's operating hours. When you are done, click the green checkmark.

      • Input Day: specify the day of the week or your preferred text (e.g., 'Monday', 'Mon - Fri', 'Weekdays').

      • Open From: specify the opening time (e.g., '9 am' or 'Noon').

      • Open To: specify the closing time (e.g., '5 pm' or 'Sunset').

    • Address
      Search for the address in the Enter a query field or enter the coordinates in the Latitude/Longitude fields. When you use the coordinates option, Google Maps will pull the nearest address.

    • Distance Type
      Specify whether distance should appear in Kilometers or Miles.

    • Click ADD to add the location to the feature.

  3. Click Service to select the order types your business accepts and how many days in advance you accept them.

    mceclip1.png

    You will be presented with the following options to configure:

    • Dine-In
      Specify if users can pre-order food to be eaten in the restaurant. This is only available for same-day service.

    • Take Out
      Specify if the order is available for pick-up. This is available anywhere from the same day to six (6) days in advance.

    • Delivery
      Specify if the order is available for delivery. This is available anywhere from the same day to six (6) days in advance.

    • Delivery Address Validation
      This is to validate the Delivery Radius. Disabling this will disable the Delivery Radius.

    • Delivery Radius
      Specify how far away a user can be to place an order.

    • Delivery Minimum
      This is the monetary value that will be added to delivery orders. This can be set as taxable or not.

    • Delivery Price Fee
      Enter the amount to charge for delivery (and if it is taxable or not) by using the toggle.

    • Free Delivery Amount
      The minimum order total for free delivery. When this total is met, the delivery fee will automatically disappear. (Enter 0 to always charge the Delivery Fee).

    • Lead Time
      The average amount of time it takes for an order to be prepared. This gives users a more accurate estimate and avoids rush orders. The Lead Time calculation works as follows (example uses a 15-min. Lead Time):

      • Opening time of 10 AM = first available "ready" time of 10:15 AM.

      • If the user chooses "ASAP," the system will take the current time and round up to the nearest 5 minutes, then add the Lead Time: Current time is 11:12 > rounds to 11:15 = first available "ready" time of 11:30. 

        Note: This buffer gives the user a more accurate "ready" time by allotting a few extra minutes for them to place the order through the app fully.

    • Convenience Fee
      An additional fee that you may wish to charge.

  4. Click Payment to set up the payment options.

    mceclip2.png

    • Currency
      Select the required currency.

    • Payment Gateway
      Select the payment gateway to receive order payments directly to the nominated account. Have a look at Signing up for a Payment Gateway for more information. 

    • Allow Pay with Cash
      Toggle to allow cash payments. 

    • Allow Tips
      This will display three Tips options at checkout (10%, 15%, and 20%, which are the only three options). 

      Important: Ensure that the {TIP} parameter is added in the message template, as it is not added by default when the Allow Tips option is switched on. More on this in Step 6.

    • Tax Details
      Click Add New Tax Amount to set a tax rate. 

      Note: Users have a non-customizable 5-minute window to complete their orders, they will experience a timeout after that interval.

  5. Click Menu, then Add Category to start building the menu.

    Note: The font and font color cannot be changed for the Categories, and Items cannot be changed.  mceclip3.png

    • Choose a Category Name (e.g., 'Entrees' or 'Salads'). 

      • Choose an image from our library or add your own in Your Images.

      • Click Add to save the category.

    • Now, click Add Item to the Category to add the actual item for sale.

      • Select Details to edit item details.

      • Select Customize to add pricing for sizes and add-ons.

        • Item sizes: set different prices for small vs. large meals.

        • Item options: add additional items (e.g., 'Extra cheese').

      • Select Availability to edit the item availability based on locations and time of day.

      • Click Add.

Note: For a detailed description of the Category Section, please refer to the Editing the Category of the Food Ordering Feature Menu KB article.

6. Click Emails to configure.

mceclip11.png

You can add any of the Email Objects below to the message body.

mceclip0.png

    • Customer Confirmation
      Select the fields required in the customer receipt.

    • Admin Receipt
      Configure the admin email address and message template.
      NOTE: Multiple email addresses may be used, separated by commas. e.g. myappname@gmail.com, manager@verizon.net, etc.

    • Custom Guides 
      Customize the details listed for your items here in your Order Items List.

Note: For more information, please refer to the Editing the Food Ordering Confirmation Email KB article.

7. Click Extras to connect a Google Cloud printer and preview the Web Widget.

mceclip7.png

8. Click Save at the top right when you are done.
mceclip8.png

Back to top 

Custom Design

If you wish to create a custom design for this feature instead of using the Global Design, you can do so here. If not, skip this section.

mceclip9.png

Back to top 

Comments

0 comments

Please sign in to leave a comment.