Online Ordering
This section will be around anything you need to know around the Online ordering.
Connect Online Ordering
The RIGHT way to set up Online Ordering
During the years we have seen many different ways of setting up online ordering, and we think we have pretty much found the right way to drive high conversion, meaning higher traffic, and as a result, more orders! from your website. In general, make sure the online ordering button is visible immediately to your customer, can be located and clicked with the fewest steps possible.
Best Example #1:
You can't miss it! Order Online X 3 times!
Best Example #2:
Sign-Up Button on Your Website
The following code should be embedded to a button:
<a href="http://YOURRESTAURANT.appfront.app/?openSignup=true" target="_blank">Signup</a>(please ensure to edit the field "YOURRESTAURANT")
This code will open the following screens in a new tab:
Desktop version -
​
Mobile version -
Branding
Home Page
You can set up 2 different home page - one for desktop and one for mobile.
Desktop
Desktop, home page:
Mobile
Mobile, Home page:
Dimensions, Image Guidelines
For more info about images - please find here:
Store Photos
Store photo is something that is very important - to make sure the customer recognize once he comes to the store.
Location Photo:
Menu Headers
Same here, an option for Mobile and option for Desktop
Desktop
Mobile
Menu Items Photos
Overview
All menu item photos are uploaded from the POS direct and synced automatically from the POS.
Setup:
Directly from the POS.
Toast:
Menu items descriptions
Upload all menu item descriptions from POS directly.
Setup:
Logo
Overview:
Your brand logo will appear in a few different places:
Order receipt:
Set Up:
Fonts
At Appfront we also have the capability to align the platform's fonts with your brand fonts! In order to update your fonts we will need you to supply us the fonts (you need to buy them) or, the recommended option, is to send us a link to adobe fonts' library (see below)
The Recommended way
Your designer is probably familiar with Adobe Kit (should look something like this - https://use.typekit.net/12345.css ), but if not, you can use the following links:
Google Fonts
Other recommended method is to use Google Fonts. Google Fonts are free to use and share. If you are using Google Fonts, simply provide us with their name and we'll upload it to our system.
Fonts files
Have your own special font, available only in a file? no problem! Just send us the font file and we'll upload it! Supported formats: TrueType Fonts (TTF) OpenType Fonts (OTF) The Web Open Font Format (WOFF) The Web Open Font Format (WOFF 2.0)
Email Receipt
You have the option to brand your email receipt as well.
Logo
As described previously in the logo section.
Email Template Background Image
Menu Items Photos
This is basically don automatically. If you do have photos for menu items on the platform, Appfront will pull those photos automatically, and will print it in the email receipt.
Sender name
We can customize the name and the email the receipt is sent from. (*with additional cost)
Image Requirements
For all image rewuirements - dimensions etc, please go here:
Menu
This section will cover the different menu structure capabilities we support in our platform (that we had the time to write about).
Min / Max Modifier Selection
Overview
We have a very cool animation the prevent to add customers more modifiers in a modifier group. In the following example, the customer allowed to choose 3 modifiers:
Once the customer choose 3 modifiers, all other options, become unavailable:
Set Up
Our system synced automatically, the only thing you should do is make sure the set up in the POS defined as follows:
Modifier Description
Appfront pulls the information directly from the POS, for example, Toast:
Multi Select Modifier
Overview
Choose the amount of modifiers (specified number), using the [+] and [-].
You can also limit the max selection for all group, in this example, 12 cookies.
Set Up
Once you set it up - our system will be synced automatically
Allergens
Overview
In this guide, we will learn how to configure allergens for your business and how to add them to a menu item. Allergens can be configured and view on the menu item level, and will be presented next to each item.
Customer Facing Preview
Once you set up the Allergens on Appfront portal, the customer will see that in a few places on the platform.
Allergens Menu:
Once you click on this button, a pop up with all allergens icon and description will be appear to the customer. Icons and descriptions it's something that you add by yourself on Appfront portal.
Menu Item Level Allergens Description:
Modifier level Allergens Description
How to set up Allergens:
Allergens are general and will be available to configure for every menu item. In order to create a new allergen, you will need to give it a title and a description (optional). The title will be used to describe the allergen icon to the user in the allergens info list in the app. Further description is optional.
Tags:
The tag is something unique for each allergen and can be used to substitute the icon in textual names within the modifiers and toppings - once you set a tag you cannot change it, so think about a good tag to describe the allergen. A tag has to be wrapped in [ ]. In order to add the icon to a modifier name - you can define an allergen of Gluten Free with the tag: [GF] and change the "Gluten Free" modifier to : "Gluten Free [GF]" and this will result in the following presentation:
Images:
In the image category, you will need to upload an SVG file for the allergen.
Adding Allergens to the list:
Add the title, Description, Tag and image and press "save".
Allergens List:
One you added an allergen, it will be added to the list:
Last Step - Adding Allergen to the menu item:
Now that we've added an allergen to our list, we will review how to add them to the actual menu item. So first we need to go to our menu (App Menu tab on current page). We will choose our item from the categories and click edit. You will see now, an allergens category on the menu item. When clicking on it, a list opens up of all the allergens that we just configured. You can choose the allergens that are applicable for this menu item, add them and click save.
Congratulations! You've learned how to add and configure allergens for your business, you should be able to see the change in about 15 - 30 min.
Allergen to the menu item MODIFIER:
You should only add Tags, and it will happen automatically
Toppings (Half / All)
In order to correlate between WHOLE toppings and HALF toppings, the Appfront menu sync process makes connections according to names.
In cases where your toppings show up with only whole toppings, please check the names of you toppings - many times the names in the Whole and the Halves are different:
Modifier Groups Positioning
In order to control the order of the modifier groups position / order, you will have to access the Appfront back office. Please see the following example:
Customer Facing at Appfront
Group 1:
Group 2:
How to swap group 2 with group 1:
Under the Appfront back office, locate them menu item, under menu section:
Drag and Drop:
Click here
See link to Video:
https://www.loom.com/share/7b106902ee7d40ad9ab9be6cc9503502
Master Menu Managent
What is Master Menu / Enterprise menu management
First of all, using master menu for multi unit chains this is probably the best thing to do. Appfront platform support different types of menu level. All stores can have one unified menu, or multiple menus, one for each store. The master menu functionality meaning is that all stores share the same menu items ids.
Different stores can still have different pricing for same menu items, but share the same ids.
Each stores also might have different menu items (for example - some can have beers and other not)
But for all shared menu items - there are share menu items ids.
How to make sure your menu is synced
Very important - with master menu, when you update one menu for specific store, you must push update all other menus to avoid possible out of sync solution.
Bad example - need to publish all stores:
POS Items
Each menu item MUST be connected to a POS item.
This short presentation explains about POS items, and how to create and connect them to menu items:
Menu Category
Visibility On/Off
There is an option to turn On/Off category visibility on demand.
Locate the category and click on edit (hover the category with your mouse)
Just toggle on/off -
Time Visibility
Category Order
Overview
Appfront allow you to change the menu category order. This should be done from the Appfront back office. The main reason for that is that sometime, you would like to have one order in the POS and other at Appfront platfrom.
How to change the order?
Please go to menu section under configuration:
In case of chain - Filter the right view according to the location:
This is an important step! - you need to make sure you are looking at the right menu if its not centralized / Master menu solution for all chain
The only thins you should do now is to "drag and drop" the menu.
Once completed - you should wait until the next sync (~30 min) - executed.
Grouping - items to category
Delivery
Delivery Price
Appfront platform support almost any possible pricing structure, from basic to advance/complex options.
Different price for different Zone
Each location/store might have multiple delivery zones. You can create different price for different zones and the set up will be under the location page.
Go to the location page:
Look for "Delivery Areas" and press edit
Fixed Delivery Price
You can set up a fixed price for delivery
Advanced Delivery price
You have the option to have flexible price, that change according to the order check size, with different ranges.
Click on "Add" advnce price:
Add range:
Done
Free Delivery > $30
In order to set up free delivery the only - Go to - location edit:
All orders above $30 will be free
Connect External 3rd Party Delivery
External means a company that AppFront is not fully Api integrated (Currently we integrated with Doordash Drive and Postmates. Read more about this integration here:
Dispatch - 3rd Partys DeliveryIf you would like to add External company. you should do the following:
Go To:
> Configure
> > Locations
> > Edit
> > > " Add More Senders"
Every email that you will add here will receive the every order
Click and add the email:
Alcohol Delivery
In order to mark a a category as alcoholic, which will force the dasher to capture photo ID at dropoff, you can select the "Contains Alcohol" tag within the alcoholic category.
Once this tag will be selected, each delivery that contains alcohol will be flagged by passing: "contains_alcohol": true to DoorDash.
Curbside - I'm Here!
This feature will allow you customers to notify you when they arrive the restaurant - with just one click! (relevant for Curbside and mobile view\mobile apps only!)
When the customer will finish placing their order, they will a small button, as seen below:
The customer can change the button's position, and it will remain in the app until the customer will click on it. Clicking on the button will show the order's details, and the customer will be able to confirm sending the notification, open Waze for directions - or archive the message (hence - the message won't be sent to the restaurant).
Confirming sending the message will send another order to the kitchen - with a text saying that the customer is here!
To enable this feature, please contact our Support team at support@appfront.ai
Drop - Off (Neighborhood)
Serving Option Setup
Enable / Disable
In order to disable serving option you'll need to check "Hide this serving option"
Disable Serving Option in location
In order to disable a serving option in a particular location, click the "Unavailable in" field inside the serving option and select the location(s) you'd like to remove:
Serving Option Name
You can edit your serving option name. For example - pickup / order ahead etc.
Serving Option Description
Set Up
Edit description under the POS:
Enter the text:
Customer Facing
Delivery Zone per Serving Option
For every serving option you can define different delivery zones.
Edit location:
Choose the delivery Option you would like to set up delivery zone:
Timing
Ordering timing set up is different between the serving options. This section will explain how to set the up the timing option for each serving option
Delivery Hours
Related to the delivery area, because every delivery area can be set with different times.
Click edit, and scroll down below the map:
You should click on the "watch sign". and a pop up will be opened.
And then just click on the numbers to edit.
At the end dont forget to "Save Changes"!
Self Check:
We do recommend to try and place a delivery at the end - and make sure the time was updated (should take up to 20 min).
Menu Items and Category Hours
Do you have menu items / Category that available only in specific times? No problem!
This is something you will have to set up in AppFront's portal (we currently not pulling the time from the POS as part of our menu sync, and it has to be synced manually)
Click on the Edit sign -
Adding days. locations:
And, don't forget to SAVE:
Delivery Time
The time it takes you to delivery the order to your customer
Set Up
Edit Location:
Edit Delivery Zone (Choose one zone): - you will need to scroll down.
Update the Delivery Time:
And SAVE.
Customer Facing
Order Confirmation Email Update:
Online Ordering Platfrom:
The FIRST available ordering time:
First available ordering time =
Current Time + Delivery Time + Prep Time
Prep Time
Preparation time (Prep time) - how long it takes to prepare the food. It actually influence ONLY on the "First available ordering time".
Set Up
You can set up different Prep Time for Pick Up / Delivery
How to video
Customer Facing
Scheduled Prep Time
In case you want different prep times for peak hours, you can use our "Order Scheduling" Module and set different prep times for specific time intervals and dates.
1) Go to our New (Beta) section > Order Scheduling. 2) Click on "Add new scheduling" 3) Set the "Scheduling Event" to "Prep Time" and the prep time value below it. 4) If this is for the holiday season for example, you may set a date range. 5) If this is for particular hours of the day or for particular days of the week, click on "Add Hours" 6) Add the relevant locations and serving options 7) Once you've finished, click the "Publish" button at the bottom and if you want to enable this, switch the toggle on the top to "Enabled".
Future Ordering
There are 2 types of future ordering options - both can be controlled on Appfront back office
Same day future order
Schedule Order (different day)
The default is both options are enabled.
Store Hours
Login to your Appfront portal:
Click to edit.
At the end - scroll down and SAVE
Store Opening Time Frames
If you would like to creates 2 different time frames for store opening - you should do it under menu set up. You can defined different time frames for different serving options.
Click on "12 Time Frames" button - and add Time frame:
Schedule Store Closing Hours
Please click here.
Order Throttling
Choose how many orders can be accepted in time interval, for example, 15 orders for every 15 minutes.
See video below:
Note that you can also enable this feature without selecting dates or hours.
Auto Order Throttling
The feature will allow you to pull and mimic the order throttling and prep time from your POS. This option is currently available in limited POS companies:
Toast Tab
The parameters will be pulled directly from your Terminal
You can also change it from your Orders Hub - see THIS article by Toast.
Order Notification
Text when ready
This option is related for Pick up and curbside only. Please note that there are 2 modes - with KDs and without KDs from the POS, and another option to send directly from Appfront portal.
How to set it up
In order to set order notifications, go to the Appfront portal > Configure > Locations > Select a location:
Once inside the location page, scroll to the bottom right side of the page until you see the following settings ("Enable Text message when order ready"
Notifying customers of Order Ready
In order to activate text messages for order ready from the activity log, set the following parameter:
After saving the location, you will see for each pickup/curbside order in the activity log on the Appfront portal:
Notify when ready from KDS
When toggled on, an SMS notification will be sent once the order is marked as "Ready" from the KDS (Toast POS only).
Notify (without KDS)
When toggled on, the SMS notification will be triggered once a menu item is added to the order from the POS. We recommend creating a dedicated menu item for this and setting this item as trigger:
Notify from Appfront Activity Log
Location Confirmation
It is optional to add a confirmation modal before placing an order:
Please reach out to support@appfront.ai if you're interested in activating it.
Order Failure
Delivery Failure
Order Routing
Our platform is able to route your orders to many different sources apart from the POS.
Via Fax
In order to configure orders to be sent to your fax, you'll need to have this option chosen on your location's configuration page and add the following parameters for this location:
shouldWaitForTransactionId ; false
faxNumber ; Add your Fax number as the value
Via Email
In order to configure orders to be sent to your email address, you'll need to have this option chosen on your location's configuration page and add your branch's email address:
IMPORTANT - The order parameters should still be configured as usual when this option is chosen. Make sure they are configured correctly while the 'POS' 'Send Order VIA' option is chosen.
Failover (Automatic)
In order to have orders sent to the next available platform after the first attempt failed (for example, send the order to your fax after the connection to the POS failed), you'll need to add this parameter to your location:
shouldCancelOrderOnFailure ; false
Tips
Tips can be added to any serving option, mainly for Delivery and pick up. We supoort both percentage (%) and customed tips.
Delivery Tip
Disable / Enable Costumed Tip
We can disable the custom tips with the following toggle within the location editor:
Setting the tip options
Use the following parameter in the location editor:
tipOptions_SERVINGOPTION
for example: tipOptions_pickup - 0,10,15,20
Setting Default Tip
Pickup: defaultSelectedTipOption_pickup Delivery: defaultSelectedTipOption_delivery
For example - setting a 15% tip default for pickup & delivery:
Pick Up Tip
There is also an option to set up Tip for pick up. The Tip will appear in the checkout page, same as delivery tip:
Set up:
Tip Reporting / Back Office
There are 3 ways to mark tips:
Tips as service charge - all tips will be marked under the service charge field, meaning that you will need to take care of tips management. This option is usually used when using 3rd party delivery fulfillment services
Tip Pool - all tips will be marked under the POS management. Basically the tip will be attached to the current employee that logged in to the POS.
Tip for specific employee - create a "fake employee" that all tips will be attached to this account
As a service charge
We can report tips as a special service charge that would be pooled together. This is good practice for 3rd party delivery as they can invoice you directly for those tips.
How to sum the data?
In Toast go to Analytics & Reports > Sales and in the "Service Charge" bracket you'll have a "Delivery Tip" article with the amount of tips pooled.
This is how it is printed on the receipt:
As a tip
The other way to report tips as "tips", like they are printed in Toast. This will allow you to pool tips received from Appfront orders with the rest of the tips that are handled in the store.
This is the most recommended way of pooling tips, as it is reported exactly as Toast planned and is easier to export a report of the pooled tips.
If you choose this option, you can also pool all tips to a selected server. You can read more about this here:
How to sum the data?
In Toast go to Analytics & Reports > Sales and at the top left you'll have the total summary of Tips pooled. By default it will display all tips, not only online orders.
This of course is to be expected, as in this setting the tips are meant to be exactly like the tips that are gathered in the store.
This is how it is printed on the receipt:
Please note: some states may account for service charges as income and may tax you for service charges. If you're unsure to the legal status of Tips vs. Service charges, we recommend consulting with an accountant.
Appfront is not liable to any tax regulation incurred due to the selection of pooling tips as a service charge.
Tip Values
Serving Charge
You can add additional service charge for any serving option automatically.
Type of service charge
Fixed - fixed $$ for every transaction
Percent - % $$ from every transaction
Appfront Set Up
Go to:
Enable the service charge in the Appfront side
Create Service charge in POS
Connect POS side
Please notice - this is critical step.
Please connect Appfront's support (support@appfront.ai) and ask them to connect the new service charge. Otherwise, would be gaps in reporting.
Payment Methods
We support both Credit card and Cash options.
First step - go to locations:
Cash
Scroll down and/or search for: "Cash Payments"
Credit Card
Scroll down and/or search for: "Credit Card Payments"
This is something you will have to set up in AppFront's portal (we currently not pulling the time from the POS as part of our menu sync, and it has to be synced manually)
Special Request
Checkout Page
Spcial request, i.e. comments on the check out page, appears by default ONLY in delivery orders.
Item Level
Customer Facing
Set Up
Update comments on item
Utensils and #diners
It will be printed on your receipt.
To configure, please see https://appfront.gitbook.io/portal/menu-editor/setup-tab#fixed-remarks
Tickets Printing
Tickets printing its something that usally very coupled with POS and configured there. AppFront sends to the POS the order time, and the "decision" when to print, is done on the POS side.
Prep Time
Toast:
Immediate Printing
Toast's default printing of a future order is the amount of prep time set in Toast before the scheduled time.
For example: if an order is placed on Monday at 4:00 PM and is scheduled for Wednesday at 2:00 PM, and the prep time is 30 minutes, it will only print on Wednesday at 1:30.
However - Appfront has a feature to circumvent this behavior.
If you choose this feature it will behave the following way:
If an order is placed for later today (customer places an order on Monday morning for Monday afternoon), the order will print as soon as it's placed with an item that prints the actual pickup time (see image below).
If an order is placed for a later day (customer places an order On Monday for Wednesday), the order will print on the day it is due at 8 AM (following the example, on Wednesday morning), with the comment of when the customer chose to pickup the meal.
If you choose for the order to print immediately, it will not fire again.
Future printing
Meaning, printing the future time minus prep time. This is a set up in the POS
Tickets Routing
Routing to the right prep station is configured in Toast POS.
Double Printing
Issue was fixed in Toast - 07/2020.
Please find how to disable the double printing
Not Printing
2 options before reaching out to your POS support:
1) Change from Wifi mode to Ethernet
This is according to Toast support
2) Change approval mode
Switch to "send orders directly to kitchen"
Deals & Promo Code
Deals and promo codes are a great tool for marketing! A promo code can be attached automatically or by entering a text promo code.
15% Off code for Pick Up
Create new deal:
Leave the "promo code" field if you like the deal apply for every order:
Set the deal type:
Customer Facing:
Reporting
Sales Report (Toast)
Order notification
Appfront system allow you to receive an order notification for every order received in the platform. You can set it up for store level, i.e., for each store, different people can receive the notification.
What type of notifications?
Emails
Text msg
Please notice - text msg will require additional cost.
How to set it up?
Under the locations' set up:
Click edit and search for: "Add more senders":
Choose email:
Add your email and/or phone number.
Appfront Back Office
POS
Appfront is fully integrated with your POS (We do have a stand alone solution as well (in that's case - skip the POS section) - and all transactions, either credit card or cash, are reported to the POS, and marked under dedicated serving option and/or payment type. In order to confirm the money you received from Appfront, you should check your POS only and can confirm with the data reported on Appfront's back office.
Toast
Appfront is integrated with Toast payments directly. Meaning that all transactions are processed via Toast's processing and will be deposited and have the same terms as you have with Toast.
In order to check how many transactions were in Toast via Appfront you should do the following (inside Toast's back office):
Choose the dining option (Appfront is marked directly to specific dining options):
Choose Appfront's dining options:
Click on update, and scroll down to see the results:
This is the total amount mapped for Appfront's dining options, i.e., all transactions were made via Appfront.
You can also check the dining options:
Appfront Weekly Report
Transaction Monthly Report
Troubleshooting
Toast POS
AppFront and Toast are fully synced, so any change you make in Toast is reflected automatically in AppFront.
Currently there is only ONE update per day (this is related to Toast POS menu export)
The update takes place anytime between 3am-8am (local store time)
Different Pricing in Toast Vs AppFront Email notification
Toast is the priority. AppFront's email is used for backup, for notifications, and for the menu structure export. Usually the differece is that Toast charge for the tax - and we aren't
App Rounding / Sales Tax Adjustment
Once in a while, you might notice, that there is additional line says "App Rounding" or "Sales Tax Adjustment" on the customer receipt / check. This is an auto mechanism solution, to make sure that the check balance due is Zero (0).
Check Rounding Example:
The Root Cause - Different Tax calculation Mechanism
Until now, Toast supported item level tax calculation. Around last week (May 2020) they started to launch check level tax calculation. Only small percentage of customers received this update. In order to avoid problems, Appfront tax calculation set up should be the same as Toast.
(Sum all items) X Tax = Final Amount
Toast calculates tax as follows:
(Item 1) X Tax + (Item 2) X Tax + (Item 3) X Tax + ...... = Final Amount
Which might cause a few cents differences (either Toast or Appfront will charge a few cents more - depends on the rounding up/down)
In the Example above: (Tax rate - 9.86%)
How to check how much Rounding gaps do I have (between Appfront & POS)?
We know that you probably worried about the gaps, but we can assure you shouldn't. There is an easy way to check it out. Go to your back office and follow the steps:
Choose More and filter by "Dining Options":
And then, filter ALL dining options related to Appfront:
Run a report for the last 30 days:
So how much are the gaps?
Scroll down to "Rounding" under "service charge" - and this is the number:
0.83 cents - this is the gap between Appfront to Toast.
How we should handle it?
The avg. gap is about $1 more/less per month for high volume restaurants. Our last update was that Toast is working on a new tax calculation method (per check and not per item), and should be deployed around Q1-Q2 2021. Until then, we will keep use the rounding mechanism as the best option.
Chargebacks
Chargebacks are painful, no question about that. Appfront support some extra safety layers, depends on the processor we offer different security layers (with First Data, Worldpay we have the highest security option.
What should I doo when there is a chargeback?
You should work directly with your processor. Appfront is not part of it. For First Data, Worldpay (and some others) - we offer an additional security layer (check with your account manager).
Toast Processinig
Appfront utilizes Toast Payment processing, the regular chargeback protocol is followed on Toast Backend to dispute those charges. Please keep in mind that any online credit card transaction will be equal to a keyed in Credit Card, exposing yourselves to potential chargebacks.
Blocking accounts in Appfront Back office
Blocking account in Appfront will block the customer from using the platform again.
Last updated