How to Create an Online Delivery Site on WordPress with WooFood

he 80% percent of online websites are built in WordPress. Why not an online delivery site for a restaurant?

There are many plugins out there that can transform your WordPresssite into an online delivery site , but today we will test out WooFood

We preferred to use WooFood because its the only plugin out there that combines everything an online shop requires for a restaurant like

  • Extra Options(like toppings etc)
  • Accept /Decline Order functionality
  • Automatic Order Printing

Additionally you can use any plugins compatible with WooCommercelike payment gateway or any other plugin extends the WooCommerce functionality

First of all we will need to buy WooFood from Codecanyon .Here is the link WooFood

Next step is to download all files from Codecanyon and also download the purchase code.

Inside the zip you will find woofood.zip . This is the WooFood Theme(including also the WooFood plugin required) . Upload it on your WordPress and after activation it will ask you to install also WooCommerce that depended on it and WooFood plugin.

After finishing the installation of both WooCommerce and WooFood navigate to WooFood-> Settings and complete all the following details

  • Your purchase code
  • Google API key for Maps Javascript (This API Key required for Address AutoComplete)
  • Google API Key for Distance Matrix (This API required for Distance Calculation from the Store to Customer’s Address)
  • Maximum Delivery Distance(You must set this to accept orders only from customer within your area)
  • Store Address(It’s required to complete the store address because it’s used with Distance Matrix API to calculate the address between store and customer )
  • Enable or Disable the Accept /Decline Orders (By Enabling this Option the restaurant will be able to Accept or Decline Orders in Live mode from WordPress Backend or directly from AutoPrint App) . If you enable this option be sure that you have completed also Minutes to Arrive (Comma seperated) like 30,40,50,90 . These options will appear under WooFood-> Orders when a new order is coming and the restaurant will be able to set the minutes to show to the customer.

Note:Also under Settings -> Permalinks be sure that you are using pretty permalinks and you are not using plain permalinks. This is required for WooFood API to be able to connect to Automatic Printing Software.

Let’s create an extra option category like toppings

Navigate to WooFood -> Extra Option Categories and create a new Extra Option Category with name Toppings and select also the Extra Option Category type. If you want the customer to be able to select multiple options select Multichoice, if you want to limit the selections select Limited Choice and type also the number of Maximum Options on the next field .Otherwise if you want to have a single choice select single choice and press Add New Extra Option Category

We have created the toppings category. Let’s add some options to toppings by going to Extra Options and press Add Extra Option and enter the name of Extra Option like Sauce.If you want also to set an price for this option set it on Extra Price field and select on the right side under Extra Options Category the category Toppings.

Repeat the above step a few more times to create some more extra options for the same category.

Let’s assign these extra options to a product. Extra options are compatible both with simple and variable products so you are able to assign different extra options per variation if you want.

Simple Product. Create a simple product and on General Tab you will see a list where you can select one or multiple extra option categories by pressing CTR + selection or CMD + selection if you are using MAC. Select the Topping category and save the product.You are ready.

Variable Product. Create a variable product and under variations you will be able to see the same multi-select list like on the simple product. Select the Toppings and save the variation . Update also the product and you are ready with variable product.

Let’s Setup The Delivery Hours

Navigate to WooFood -> Delivery hours and you see a form with all Week days where you can set three different time frames for each day. This will help you setup your delivery hours if for example you are delivering from 10:00 to 15:00, you stop delivering for some hours and you start delivering again from 17:00 to 21:00 .

Automatic Printing Software

Inside the zip you downloaded from Codecanyon included also two versions of WooFood AutoPrint Software , one version for Windowsand one for MAC. Install the software and open the app and complete your purchase code your admin or shop manager username and password. Select the printer and how often you want to check for new orders. If you are using shared hosting we are suggesting to check every 20 seconds, otherwise if you are on a VPS or a Dedicated select 10 seconds and you are ready.

If you have Accept/Decline orders enabled when a new order is coming you have to accept first the order and the order will automatically get printed . Otherwise all orders will automatically get printed on the printer you have selected.

By clicking on an Order you will be able to mark the order as completed , cancelled or delete it.

Note: Be sure that you are not using caching on REST API. If you are using caching plugin like W3 be sure that you have disabled the Caching REST Option or if you are using nginx in front of Apache be sure that you have added a rule to bypass urls including “wp-json” .