Title graphic for "How to create a WooCommerce restaurant ordering system"

Till just lately it was one thing regular for any restaurant to have a well-maintained web site. Even so, it appears that evidently for a lot of eating places this was one thing troublesome to obtain.

In these troublesome instances, for a lot of restaurant house owners and different companies on this discipline, proudly owning only a easy web site is not sufficient. In the event you nonetheless need to stay in enterprise you may have to adapt shortly and discover alternate options. Taking on-line orders by way of your WooCommerce restaurant web site and delivering them to your clients can be a very good begin.

However what if you happen to weren’t ready for such a state of affairs and your corporation is affected?

Nicely, with this text I’ll strive to provide you with a hand of assist and clarify how one can shortly create an on-line ordering web page to your restaurant utilizing WordPress and WooCommerce.

Instruments we’ll use for the WooCommerce restaurant system

Earlier than continuing to the wanted steps, let’s check out the instruments we’ll use:

1. WordPress – I’ll assume that your web site is already constructed on high of this platform, so we’ll not get into too many particulars right here. Nonetheless, if you happen to’re new to WordPress and site-building typically, you’ll be able to shortly create a WordPress website by getting your internet hosting from SiteGround. We even have an article devoted to making a WooCommerce restaurant web site from scratch, so make certain to test it out.

2. WooCommerce. Putting in this plugin in your WordPress web site will remodel it into a strong eCommerce retailer so to begin including your merchandise and promote them.

3. Delicio Theme. That is our hottest WordPress theme for eating places and cafés. It contains full WooCommerce assist and highly-customizable design that may be tailored simply to your model.

4. Beaver Builder and Beaver Builder Addons. Utilizing these two free WordPress plugins we’ll give you the option to shortly create a customized ordering web page on which you’ll prepare your dishes as you need.

5. WooCommerce Product Desk (non-obligatory). This can be a highly effective add-on for WooCommerce that can assist you to take the ordering web page out of your web site to the following degree. It’s going to add particular options, resembling quick one-page ordering and exhibiting extra particulars about every dish.


Step 1: Add Meals Gadgets as WooCommerce Merchandise

On this first step, we’ll have to fill the web site with the dishes your restaurant sells.

We’ll add the meals gadgets as new merchandise in WooCommerce. Make sure that to use high quality images to your merchandise and in your web site, typically.

Including your meals in WooCommerce may be very easy, and normally, you should have to fill within the following particulars: Featured Picture, Description, Class, and Value.

Make sure that to set up your merchandise in the best Classes, as we’ll use these within the subsequent step.

When you’ve got particular dishes provided in a unique dimension or possibly with extra toppings, you should have to change the Product Sort to “Variable Product“. This manner, you’ll be able to create new attributes that can later assist you to to create product variations, the place you’ll be able to set a unique worth, for instance.

For extra particulars about making a Variable Product in WooCommerce, please refer to the official documentation.


Step 2: Create the Online Ordering Page to your Restaurant

That is the step I discover probably the most attention-grabbing, as you could be as inventive as you need in constructing the web page the place the meals will probably be displayed.

On the demo web page of Delicio, yow will discover two totally different Ordering web page designs, so I’ll clarify how to create every of them beneath:

Create an Online Ordering Page utilizing Beaver Builder

For this step, we’ll use the free model of the Beaver Builder plugin accompanied by our free add-ons plugin.

The default Store web page generated by WooCommerce doesn’t present sufficient flexibility, in order that’s why we’ll use a Page Builder and design the web page as we would like. On this means, we will make the web page look extra organized and we’ll have full management of what dishes seem and the place.

Drag the WooCommerce module included in our add-ons plugin in your web page created utilizing Beaver Builder and choose the class of merchandise to show:

Repeat the identical factor for as many sections with programs or kind of merchandise your restaurant gives:

You possibly can go much more inventive and add a piece the place you’ll be able to spotlight particular merchandise.

For instance, utilizing the WooCommerce module in Beaver Builder you’ll be able to show Featured Merchandise or Finest Sellers:

See how I’ve set all the pieces up on this web page.


Create an Online Ordering Page utilizing WooCommerce Product Desk

WooCommerce Product Desk is a business plugin created by Barn2 and its worth begins from $99.

Whereas within the earlier step we’ve created a easy ordering web page utilizing Beaver Builder, on this step we’ll create a web page with extra superior choices utilizing the WooCommerce Product Desk plugin.

You possibly can see the ultimate end in this demo.

WooCommerce Product Desk is a superb plugin that can be utilized for any form of WooCommerce retailer, however we discover it to be supreme for WooCommerce restaurant web sites.

Listed below are among the benefits of utilizing WooCommerce Product Desk in contrast to the earlier technique:

  • You possibly can customise the columns with particulars about every merchandise
  • Clients can choose a number of gadgets and add them to cart with one click on
  • The plugin contains extra options like Search, Kind & Filter

The next instance from the demo was created utilizing the default WordPress editor, so no web page builder is required on this case.

To make the web page look extra organized, we’ll insert the wanted shortcode a number of instances and show solely dishes from a selected class in every part:

Right here’s an instance of shortcode used above:

[product_table category="starters"]

Customise the Product Desk

By default, WooCommerce Product Desk will embody columns with particulars like Picture, Identify, Description, and Purchase Buttons.

From the settings web page of the plugin situated in WooCommerce > Merchandise > Merchandise desk, you’ll be able to simply change the order of the columns or add new ones:

A listing with all of the accessible columns could be discovered within the documentation of the plugin.


What’s Subsequent?

Our aim with this text was to present how simply you’ll be able to create an on-line ordering web page to your restaurant with a minimal spending. Thanks to nice instruments accessible without cost like WordPress and WooCommerce, you’ll be able to construct and handle your personal restaurant web site with a small price range.

WooCommerce is a posh plugin and there are dozens of add-ons accessible to add virtually any performance you need to your web site.

Listed below are among the subsequent steps you should have to maintain when constructing an eCommerce web site to your restaurant however haven’t been coated right here:

1. Set opening hours and supply instances. You are able to do this utilizing WooCommerce Supply Slots.

2. Arrange delivery zones and restaurant supply areas. If you need to enable takeaway orders, you should utilize WooCommerce’s built-in Native Pickup delivery technique.

3. Arrange fee strategies. You’ll want to determine whether or not you need to settle for on-line funds, settle for money on supply, or each. You possibly can arrange your fee strategies by going to WooCommerce → Settings → Funds.

Advisable Guides

Our buddies at Barn2 have extra in-depth articles written on their web site about making a Digital Restaurant with WooCommerce, so we suggest to test them as effectively:

Tutorial: Create a WooCommerce Restaurant Ordering System
Create a Restaurant Ordering System – Begin Promoting Online within the Coronavirus Lockdown
Full Information: How to Set Up and Run a Digital Restaurant


Let the WPZOOM group assist you to get began!

We actually hope that you just’ll discover this text helpful for organising your WooCommerce restaurant web site and finishing it with the lacking options.

Let’s do a fast rundown of the instruments you’ll want to create an on-line ordering web page for a WooCommerce restaurant:

1. WooCommerce
2. Delicio Theme
3. Beaver Builder and Beaver Builder Addons
4. WooCommerce Product Desk

In the event you determine to select our Delicio theme to your web site, I assure that you just’ll have our full assist in a well timed method to absolutely arrange your web site from the beginning and to the launch.

So if you happen to’re undecided the place to begin or want an recommendation, get in contact with us or ask a query within the feedback beneath.

Leave a Reply