How To Add Food Menu To Your Website on WordPress

WooFood allows you to easily add a food menu to your website. It includes an easy to use interface that lets you customize the look of your menu.

Install WooCommerce

In order to create a food menu using WooFood, you will need to install WooCommerce plugin . After completing the installation of WooCommerce you will be able now to create your new products for your menu.

Create Food Menu Items

Let’s start with creating your food menu items as products by navigating to Products > Add New .

Adding New Product on WooCommerce

There are two types of Products , Simple and Variable Products . But what the differences between these 2 product types ? Let’s see the differences between these product types and what will suit best for our food menu products.

Product Type can be selected from the Product data option as you see also the above screenshot

Simple Product

This type of Product has no options for the customer to select like “meal size”, “pizza length”, “bun size”. You will select this product type when the food menu item is “fixed” and no options should be offered to the customer for selection

Variable Product

From the other hand , the variable product allow you to create variations of this product and setting also different pricing for each variation . The most of the times a Variable Product will match better to a food menu item because the most of the times the menu items are adjustable . Take a look on the following picture to see how a variable product can look like.

Variable Product on Food Menu

On the above example a Pizza item is a variable product with 3 Size variations and different pricing on each variation . Let’s see also how a variable product look like on the backend side and how it’s configured

Creating Attributes

Creating attributes on WooCommerce Product

Before creating the variations you will have to create the attributes first like on the above screenshot. We have created an attribute with name “Size” and have added 3 different attributes under the values option separated with “|” . To be able to create the variations of your Pizza on the next step , be sure that you have also checked the option “Used for variations“.

Creating Variations

Navigate to the next tab option “Variations” . To make your life easier and instead of creating one by one the variations you can create all the variations automatically based on the attributes you have created on the previous step.

Creating Variations for a food menu item on WooCommerce

To do it , you will have to select from the dropdown option the option “Create Variations from all attributes“. Press the “Go” button. After that the system will ask you for confirmation if you want to create 3 variations and you will press “Ok” to confirm it.

After that your variations will like this

variations table woocommerce

Set Pricing for each Variation

Press the small “arrow-down” icon to expand variations options and be able to set the price . After expanding it your screen will look like the following screenshot where you can set the regular price of your food menu item

Variation Configuration WooCommerce

After settings all the prices by setting on the regular field the price you want. Don’t forget to press the “Save changes” button on the bottom of the variations .

Extra Options / Toppings / Sides

WooCommerce by default does not offer an option to add toppings or sides for your food items. This is where you can use a plugin like WooFood to add these extra features you want to your menu. Now let’s see the Extra Options we can use from WooFood.

Navigate to WooFood > Extra Options Management and press the button New Extra Option Category

Creating Food Topping and Extra options

Group Title

On the Group Title type the name you want to appear on the top of the extra options, like “Sides”, “Sauces” etc..

Visible As

This option allow you to display a different Group Title to the frontend customers and have the Group title option for internal use. Very handy option if you have too many extra option categories with the same visible name and different internal

Type

Checkbox Multi-choice : Select this option if you want to offer multiple selections of extra options with no restrictions on the number of options .

Limited Choice: It’s exactly like the multi-choice with the only different that you can limit the maximum number of selections by setting the Maximum Options field to the maximum number of choices that allowed to be selected .

Single Choice Radio: Radio button options with single choice select . Ideally suits best to an option like “Roasting” when a single option is allowed for selection . (“Rare”, “Medium”, “Well”)

Single Choice Select: Same behaviour like single choice radio but in Dropdown option instead of radio buttons .

Style

Styling option has 2 different options , “Accordion” and “Flat”.

Accordion: Extra Options will appearing inside a collapsed accordion . Ideal solution if you have more than 1 extra option categories assigned to the product

accordion food toppings collapsed
accordion food toppings

Flat: As the name says, flat option will display extra options with a flat display format like on the following picture. Mainly used when only one extra option category is per product.

flat food toppings style

Assigning Extra Options on a Variable Product

Navigate to Product Edit and go inside Variations Tab. You will see a screen where you can select the extra option categories you have created before to the variation.

toppings, side selection on variable product

Select all the Topping groups you want to appearing on this variation. You can always select different extra options for each variation.

More Options for your Food Menu

Our Food Delivery Plugin, WooFood, having too many options and very useful for your operation like the following.

  • Delivery Hours
  • Takeaway Option
  • Distance Restriction
  • Automatic Order Printing