Host Your Own Restaurant Ordering System With WordPress And WooCommerce

Want to create your very own restaurant ordering system using WordPress? Those third-party ordering systems sure are convenient, but they usually take a hefty chunk of your sales - and that sucks! With WordPress and WooCommerce, you can create your own fully-functioning restaurant ordering system where you get to keep all the money. No more third-parties eating up your margins!

This article was written by our experts using our in-depth analysis methodology.

Table of Contents

Sponsored Ad

Want to create your very own restaurant ordering system using WordPress? Those third-party ordering systems sure are convenient, but they usually take a hefty chunk of your sales – and that sucks!

With WordPress and WooCommerce, you can create your own fully-functioning restaurant ordering system where you get to keep all the money. No more third-parties eating up your margins!

And in this post, I’m going to show you exactly how you can use WordPress and WooCommerce to create such a restaurant ordering system:

example of restaurant order form

Let’s do it!

What You Need To Create This Restaurant Ordering System

Let’s start at the beginning…

If you want to pull this off, you’re going to need a WordPress site. If you’ve already built your restaurant’s website with WordPress – congrats! You’re ahead of the game.

If not, it’s pretty dang easy to create your own restaurant site with WordPress. These guides can help:

Once you have a working WordPress site for your restaurant, you’ll use the following two plugins to actually set up your restaurant ordering system:

  • WooCommerce – free – this plugin adds eCommerce functionality to your store. By the numbers, WooCommerce is the most popular eCommerce platform on the entire Internet.
  • WooCommerce Product Table – $75 – this plugin helps you create a restaurant order form that displays your entire menu.
  • WooCommerce Restaurant Ordering – $149 – this plugin lets you add a quick, one-page food order form to your restaurant website.

I’ll also recommend some other extensions that come in handy for certain things, so you might end up wanting some of those as well.

Essentially, you’ll use:

  • WooCommerce to manage menu items and categories, as well as process payments and manage customer details.
  • WooCommerce Product Table to create the actual restaurant order form that people will pick food items from.
  • WooCommerce Restaurant Ordering to create a quick food order form that people can use to add food items and beverages to their shopping cart.

I’m going to assume that you have both plugins installed at your site for this tutorial.

WooCommerce Restaurant Ordering Plugin

Take food orders easily and efficiently using the WooCommerce Restaurant Ordering plugin by Barn2.

Buy Now

If you struggle with how to set up WooCommerce, you can check out our beginner’s guide to WooCommerce for some extra help. And don’t worry about any configuration with WooCommerce Product Table – that’s what I’ll cover in this article.

An Example Of This Method In Practice

Want to see an example of how food ordering works via this method before digging in?

I live in Hanoi, and I discovered that one of my local restaurants actually uses this exact method to power their self-hosted restaurant ordering system. It really is pretty convenient…

Check it out:

example of a restaurant ordering system built on wordpress

How To Create A Restaurant Ordering System With WooCommerce

Once you have both WooCommerce and WooCommerce Product Table installed at your WordPress site, here’s a step-by-step guide to getting set up with your very own self-hosted restaurant ordering system.

WooCommerce Product Table

Create flexible, searchable, and filterable list of all your WooCommerce products with ease.

Buy Now

Step 1: Add WooCommerce Product Categories For Your Menu Categories

Your restaurant’s menu probably has several different categories. For example, an Italian restaurant might have categories for:

  • Pizza
  • Spaghetti
  • Salads
  • Etc.

You get the idea…

To preserve the same structure in your restaurant’s ordering system, you’ll use WooCommerce product categories.

To create categories for your menu, go to Products β†’ Categories in your WordPress dashboard and create as many categories as needed:

woocommerce product categories

Repeat the process until you have WooCommerce product categories for every menu section that you want to include in your online ordering system.

Step 2: Add Individual Menu Items As WooCommerce Products

Now that you’ve created the actual categories for your menu items, it’s time to add your individual menu items.

To do this, you’ll add each item as a WooCommerce product. This one is a bit trickier because there are more fields to fill out – but I’ll take you through it.

To create a new product, go to Products β†’ Add New. You’ll see a ton of different fields, but you don’t need to fill all of them out:

add woocommerce product

Let’s cover the big stuff first:

  • Enter the food item’s name in the Product name box
  • Enter a description in the main text editor
  • Add an image of your food item in the Product image box
  • Use the Product categories area to select the right menu category
  • Optionally use the Product tags to add additional information (e.g. to mark vegetarian items)
basic settings

Then, you need to dig into the Product data box that appears under the main text editor.

First, choose the product type from the drop-down.

  • If the food item only comes in one “version” – like a salad with set ingredients – you can use Simple Product.
  • If the food item has multiple “versions” – e.g. different sized pizzas, optional add-ons (like adding chicken to a salad), then you’ll want to use a Variable Product. And if you want to let shoppers really customize your items (e.g. choosing from lots of different toppings), then you might also want to use the official Product Add-Ons plugin.

This screenshot demonstrates the difference between a variable product and the Product Add-Ons plugin:

vriable vs add-ons

For a Simple Product, you can pretty much enter the price and call it a day:

product data

For a Variable Product, you’ll first need to enter some Attributes (for example, the different sizes of a pizza would go in the “size” attribute):

variable product

Then, you can add prices for each variation in the Variations tab:

variations

I know – variable products can be a bit tricky. If you need some more help, I recommend checking out this help article. And once you get the hang of it, it will get a lot easier for future menu items – I promise!

Once you finish adding your first menu item, repeat the process for all your other food items.

Step 3: Use WooCommerce Product Table To Create Your Restaurant’s Order Form

Once you’ve added all your menu items, the next step is to give visitors a user-friendly way to order them. That’s where WooCommerce Product Table comes in.

It takes your individual menu items and displays them as a list on the frontend, complete with options that let visitors select variants and add menu items to their carts.

To use WooCommerce Product Table, you can either configure the plugin’s styling in a graphical interface by going to WooCommerce β†’ Settings β†’ Products β†’ Product tables. We have a guide on how to use the plugin here.

Or, you can just build your shortcode using shortcode parameters.

To make your life easier, I’m going to just skip ahead and give you a shortcode that should work great for most restaurant order forms:

[product_table columns="image,title,description,price,add-to-cart" show_quantity="true" variations="true" links="tags" sort_by="title" description_length="-1" filters="false" pagination="false" category="pizza"]

Make sure to replace category="pizza" with the actual menu category you want to display.

For example, if you add two separate shortcodes for two menu categories like this:

shortcode on back-end

Then your restaurant delivery order form will look like this on the front end:

example of restaurant order form

Visitors can either use the checkboxes to select multiple menu items. Or, if they just want to order a single item, they can directly add it to their carts.

And remember – you can use the shortcode as many times as needed to cover all of your different menu categories.

Once visitors add items to their carts, they’ll be able to check out using the normal WooCommerce checkout system. That means you can use whatever payment gateway you prefer, or even accept cash on delivery:

restaurant checkout process

Step 4: Use WooCommerce Restaurant Ordering To Create A One-Page Food Order Form

Another way to let customers place orders is by using the WooCommerce Restaurant Ordering plugin to set up a quick, one-page restaurant ordering system.

The plugin displays the food items in a one, two, or three-column menu-style layout. You can choose to let customers add food items directly to their cart in a single click or click the food items to select variants and set quantities.

The best part is that the WooCommerce Restaurant Ordering plugin is incredibly easy to set up. You can access its settings by going to WooCommerce β†’ Settings β†’ Restaurant. All you have to do is select your restaurant order page, select which categories to display in the restaurant ordering system, and configure purchasing options.

For example, your food ordering system might look something like this on the front end:

If you set the Order method to Quick, visitors can simply click the plus icon (+) next to each food item to add it to their shopping cart. And if you set the Order method to Lightbox, a lightbox will popup on the screen that lets visitors select variants and set quantities.

Once visitors finish placing their order, they can proceed to the checkout page using WooCommerce’s default checkout system. This means that you can accept payments using your preferred payment gateway or offer cash on delivery.

Step 5: Configure Misc. Details To Make Things Work Perfectly

At this point, you have a working restaurant ordering system built on WooCommerce.

But there are still a couple of smaller details that you’ll likely want to address:

  • People can order from any location. Unless you want to ship your food across the country, you’ll probably want to restrict the areas to which you’ll deliver.
  • You haven’t addressed your store opening hours. Right now, people can still order even at 4 am. To close your ordering system when your restaurant is closed, you can use the WooCommerce Opening Hours & Chosen Times plugin.
  • You might want more obvious notifications. Because you don’t want to make your customers wait around to get their order, you need a way to instantly know when a new order comes in. WooCommerce will send you emails, but you can get alerts via different methods by using Zapier to connect to a bunch of other services.

There are also lots of other great WooCommerce extensions that you can use to add other helpful functionality.

Final Thoughts On Accepting Online Orders At Your Restaurant

Once again, WordPress shows its versatility! With WooCommerce and the WooCommerce Product Table plugin, it’s easy to set up your own restaurant ordering system and stop paying that 13% commission to a middle-man!

You can use core WooCommerce functionality to manage most parts of your system. And then you can tack on WooCommerce Product Table to create your order form, as well as some of the other optional extensions I mentioned to further refine how your online ordering works.

Have any other questions about how to create a restaurant ordering system with WordPress? Let us know in the comments!

Colin has been using WordPress for over a decade and is on a quest to test all 60,000+ plugins at WordPress.org. He has been a Writer and Product Review Expert for WP Mayor since 2017, testing well over 150 products and services throughout that time.

Sponsored Ad

More from our blog...

11 Responses

  1. Do you have a way for customers to make substitutions in their orders? i.e. no sour cream with the nachos.

  2. Do you have a way for customers to make substitutions in their orders? i.e. no sour cream with the nachos.

  3. Very good article! Thank you to the author for it! In it interesting and useful information it is possible often times re-read it! I will advise to read it all friends. It will be very useful at writing of the article. Very much thankful you.

Post a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Stay updated with WP Mayor's newsletter showcase every week

Stay on top of every new WordPress innovation and latest launches. Receive all our fresh product reviews and expert guides directly in your inbox.

Hosting Survey 2024

Are you happy with your hosting provider or are you over-paying for too little? Have your say below!

"*" indicates required fields

What's the main reason you picked this host?*
How happy are you with your host?*

OPTIONAL: If you'd like to receive the results of this survey, please enter your details below.