An online restaurant ordering system for your takeaway website is an investment worth making. It brings your business into direct sales contact with customers (gaining valuable insights) – plus, it will save you commission from food delivery marketplaces.
For example, look at this takeaway owner’s reaction having doubled-back outta 3rd-party food delivery platforms:
You too can instantly save your business ~30% commission on every sale by going independent online.
(Plus, you have more control on quality of service & retain more repeat business.)
Are you looking to build an online restaurant ordering system with WordPress?
Then, this article is just for you.
Whether you are:
- a restaurant owner with an existing system that needs an upgrade…
- recently acquired a new shop and wanting take ordering to new heights…
- a WordPress web developer or designer familiar with Gravity Forms & wanting a custom-fit solution…
…within the next few minutes you’ll learn exactly how to build a zero-commission WordPress online restaurant ordering system.
Mapping The Customer Experience Of Your Online Restaurant Ordering System
To deliver top quality customer experience, it’s worth getting granular on every detail of their journey to completion – which in this case:
- starts at visiting your restaurant’s website, and;
- ends in placing an online order.
I’ll be using a project management tool known as Work Breakdown Structure (WBS) for laying out the bare bones of the ordering process.
Good news, it’s about as simple as it sounds. Here’s the breakdown…
An Example Customer Journey Using An Online Restaurant Ordering System
So, lets take a look at an example online restaurant ordering customer journey:
STAGE OF WORKFLOW
ACTION TAKEN BY CUSTOMER
Your customer searches Google and finds your restaurant website ranking - they click the link.
Arriving at your website's homepage, the customer searches for your menu.
Menu Call To Action
They click on the 'Menu' link in your main site navigation and are taken to you 'Menu' page.
The customer browses your menu items and considers their order selection.
Fill The Cart
They add items and quantities, keeping an eye on the running subtotal in the margin of the page.
Cancel Unwanted Items
The customer cancels some items from the 'Cart' as they go along.
Review Cart Contents
With a final selection of menu items chosen and in the 'Cart', the customer views the 'Cart' one last time to make sure.
Go To Checkout
Having viewed the cart and being happy with their selection, the customer now goes to the 'Checkout'.
The customer arrives at the 'Checkout' and completes their billing details for the transaction.
With billing complete, the cutomer now fills in their shipping details to receive delivery of the meal items to be purchased.
Confirm Order Details
The customer now reviews their order details in full and are happy that the items purchased make up the desired order.
Add Delivery Notes
Additional delivery notes are added to instruct the delivery driver of where to find their apartment entrance on arrival on-site.
Select Delivery Date
A date is added to the online order.
Select Delivery Time
A time slot also is added to the order.
The customer chooses their preferred payment option.
Finally, the order is completed.
Now with an example customer journey under your belt, it’s time to build that online restaurant ordering system.
Here’s our solution…
Tutorial: Making A Custom Online Restaurant Ordering System With WordPress
As the world’s most popular website builder, WordPress offers different ways around the obstacle of setting up an online restaurant ordering system.
- Multiple plugin solutions (giving more options and functionality)
- Single plugin solutions (with less flexibility) and more custom
I’m going to show you both methods.
This giving you the wealth of choice depending on your project.
Here are step-by-step instructions to set up your appointment booking form with a multiple plugin approach.
How To Set-Up Online Restaurant Ordering Using Gravity Forms & Multiple Add-Ons for greater flexibility
Step 1. Setting Up WordPress
a. Set up a web hosting account
First step, you need to get a WordPress hosting account.
Now, it’s important to understand, there are (a) WordPress hosts and (b) hosts that do WordPress.
And this becomes critical when things get tough.
Web projects often experience difficulties.
There are just so many variables involved: security, compatibility, integration, bandwidth…
And during such storms, you need to shelter under the abilities of a host who that can comfortably take control and put things right.
This, by definition (in a WordPress sense) is WPMUDEV.
They are WordPress developers first, and then support specialists second (but outstanding at both!)
So, a great investment in your WordPress online restaurant ordering project will be WPMUDEV hosting.
b. Install a WordPress theme
The best investment is in a WordPress theme framework.
You get more control over the end product.
On the flip-side, there is more to learn but in the long run you run into fewer functionality roadblocks on the project.
Frameworks will offer easy targeting for custom touches via hooks (PHP actions and filters) helping you:
- perform visual and functional changes with precision
- achieving a truly custom finish
I recommend StudioPress’s Genesis Framework.
It’s tried, tested and proven – used and rated by many leading WordPress bloggers with over half-a-million installs.
Time: 3 hrs
Step 2. Learning WordPress
To achieve the best results and with least effort and minimal waste you’ll need a good command of WordPress.
The WP101 series of WordPress video tutorials are the most accomplished yet.
I recommend you buy a WP101 license for an excellently narrated journey by demonstration of WordPress website builder.
- Your WordPress tutor, Shawn Hesketh, has over 30 years experience
- Online experts – Chris Lema & Neil Patel recommend WP101 to their clients
- You’re guaranteed a clear and easy-reading delivery with every video
Step 3a. Install Gravity Forms
Taking any multiple plugin approach to successfully solve a WordPress problem requires compatibility.
A single framework is the best backbone for achieving this goal. A multifaceted engine at the heart of the system that orchestrates the whole show.
I recommend Gravity Forms as your WordPress data collection captain.
- It’s highly advanced, yet simple to use.
- With a codeless, drag and drop interface.
You’ll need the Gravity Forms Pro License. This package offers all the necessary integration capabilities to run the next few steps.
Time: 1 hr
Step 3b. Install Gravity Forms Add-Ons
Simply choose which functions make sense for your store:
A constant order summary with subtotal
Dynamic pricing depending on options selected
Apply tax deductions, discounts and subtotals to chckeout
Restrict availability of certain menu options LIVE
Give every customer a unique order number per transaction
Offer discounts by QR code or assign unique table identity of on-site orders
Preempt your customer on entering their address - save time, increase sales
Send a convenient broadcast email to all customers
Put together a clear tabulated report of all sales activity
Make your menu more compact and easy to navtigate for customers
Allow customers to choose menu items by image instead of text
Give customers the ability to select specific delivery slots
Allow Customers the flexibility of paying securely online via debit or credit card
Step 4. Install Rank Math
Getting noticed online via Google and Bing requires a solid approach to SEO.
And this begins with the content on your site.
I recommend Rank Math for seamlessly making your restaurant website’s SEO sing in tune with Google’s Search algorithm.
Rank Math is:
- great for effortlessly optimizing each page for SEO success
- the perfect tool for showing up in the local search
- SEO pros like Matthew Woodward use Rank Math and highly rate it’s performance
The free version will be sufficient to get you started.
Step 5. Configure and Load System Inputs
Now, you need to get all the menu items and data into your online restaurant ordering system.
The necessary admin will include:
- uploading photos
- writing item descriptions
- setting prices
- setting delivery rules
- connecting your payment gateway e.g. Stripe
Watch these Gravity Forms video tutorials for step-by-step help.
Things To Consider Before You Start…
Skills Required (Difficulty Level): Beginner Friendly
✅ Basic computer literacy
✅ Time and ability to manage this project & put into practice
✅ Happy to sit tweaking for a little to get results
✅ Basic HTML/CSS (would help)
Any experience with WordPress website administration would be a huge help
Your WordPress online restaurant ordering system will cost between $328.00 – $1,323.00 depending on options taken with Gravity Forms add-ons.
Saving 30% commission on every sale
Retain more repeat customers
Other Tools Needed:
You’ll need a takeaway restaurant website
Time To Set-Up MVP (Minimum Viable Product)
19 Hrs – 32 hrs
Woocommerce Alternatives For Online Restaurant Ordering With WordPress
I’m about to show you two plugins that use Woocommerce as the framework (rather than Gravity Forms).
Whilst the two solutions below are sufficient alone (on top of Woocommerce), they won’t offer as much customisation as the Gravity Forms solution above.
CLEAR WINNER, BY MILES!
THE 'NO-FRILLS' CONTENDER
Woocommerce Restaurant Ordering Plugin
Woocommerce Product Table Ultimate Plugin
Our recommendation: Barn2 Plugin’s Woocommerce Restaurant Ordering Plugin is a FAR more intuitive customer experience. This should make it easier for your restaurant customers, translating into more online sales. The better investment in our opinion.
Planning To Go-Live With Your New WordPress Online Restaurant Ordering System
Note that to take on a project like this without expert development help is indeed possible, but the learning curve will be familiarity with WordPress itself.
The plugins mentioned above generally have easy to follow instructions. This means you should get them in and working with little trouble.
Plugin support teams are always on hand to iron out any speed bumps you might experience as a new user.
Plus, if you think you made the wrong choice – they typically offer a money back guarantee period. Check what this is before you by.
Promotional ideas to launch your online restaurant ordering system
Now you’re going to go it alone with hosting your own online restaurant ordering, it’s time to promote the offering to new and existing customers.
Customers who are unaware of your departure from a food delivery marketplace should be made aware of when, were to order now and perhaps why you did it.
These are our recommended ways of letting your customer base know:
- Email marketing
- Social media
- Partnership marketing
- Word of mouth
Frequently Asked Questions
Where Do I Find WordPress Developers To Help Me With My Online Restaurant ordering System?
If you need to solve some complexities or prefer it being in the hands of a professional – contact us today and an account manager will respond by email within 24 hrs.
Alternatively, you could try Codeable which is a reliable marketplace for finding WordPress developers.
How Should I Plan Building My Restaurant Website?
Having a documented plan with workflow diagrams will help you connect all the dots. Website projects especially ecommerce ones like this require lots of thinking through many options and the whole user experience.
Being as visual as possible will help you picture those concepts.
Is It Worth Me Investing In Professional Food Photography?
Getting professional photos is known to help wet the appetite of a hungry diner. It’s recommended you invest today for a more profitable outcome tomorrow.
It’s Time To Bring That Online Restaurant Ordering System To Your Customers…
That’s the lot. You now know how to use WordPress to build an online restaurant ordering system for takeaway delivery, collection or on-site diners.
So, why the wait?
Get started with the most flexible and feature rich WordPress business framework for building ordering systems and much, much more.
Leave a Reply