It doesn’t matter if you’re a new restaurant or have been serving customers in person for years – having an online food order and delivery system can help increase your sales and create new revenue streams.
Given recent shifts in the global economy, restaurants with online delivery systems will fare better in the long run.
If you’re using WordPress as a platform for your website – setting up a food order system is easy, all you need is a good form plugin and a bit of time to set it up.
It’s not that hard and this guide will take you through the steps one by one.
In this article, we’ll provide instructions on how to set up your online food delivery system using the WPForms plugin.
Keep in mind that WPForms is a premium plugin and you’ll need paid Pro subscription to use it to build an online food delivery form.
WPForms is one of the best form plugins for WordPress available, and it allows you to quickly create online forms on your website without any coding skills.
Let’s start!
WPForms plugin installation
Purchase the WPForms plugin, and download the wpforms.zip file to your computer.
Log in to your WordPress dashboard, head to Plugins > Add New. Click Browse and find the wpforms.zip file that you downloaded on your computer and click Install Now.
Once installed, click Activate to activate the plugin on your website, head to WPForms > Settings, and fill in your license key.
Next, go to WPForms > Addons, scroll down and find the Form Templates Pack Addon and click Install Addon to install it.
This addon allows us to create the food order form quickly and efficiently.
WPForms plugin set up
Now that we’ve prepared everything from a technical standpoint, we can go ahead with creating our food delivery order form on our WordPress website.
Create a food delivery order form
Head to WPForms > Add New and fill in the form name. You can use whatever name you like as you can turn this off for customers if you don’t want them to see the form’s name.
Scroll down to the Additional Templates section, and use the search field to find the Takeout Order Form template. Click on the template to go to the next step and where we’ll create an online order form.
By default, the template is designed for pizza takeout; however, you can click on any field to edit and adjust it. Feel free to play around and change the labels or add/remove additional choices by clicking on the + or – buttons.
The template also allows you to add more fields to your order form, so click on the Add Fields tab on the left, scroll down to the Fancy Fields section and select the Date / Time field to add a delivery time field or Phone so customers can input their phone, etc.
Each field can be edited and adjusted to your liking. If you add the Date / Time field to your order form and only accept the same-day delivery, we recommend choosing Time in the Format drop-down menu, and then you can set the time interval under the Advanced section to 15, 13, or 60 minutes.
You can set each field to be mandatory (so the customer must fill it) by selecting the Required checkbox.
Play around with fields and options, and click Save at the top-right corner when ready to save changes.
Food delivery notification set up
Now that we have our first delivery order form configured, we also need to set up notifications to know when a new food order is submitted on our website.
By default, WPForms sends email notifications to the website’s administrator, but typically that’s not where we want to receive order notifications.
Click the Settings tab on the left (while editing the form), select the Notifications option, and you’ll see a default notification settings on the right-hand side. Remove {admin_email} from the Send To Email Address field, and fill in your preferred email address(es).
If you’re adding multiple email addresses, make sure to separate them with a comma.
Next, edit the Email Subject field and customize your subject. You can use Smart Tags to insert variables, such as the customer’s name, by clicking on Show Smart Tags and selecting Name.
WPForms will automatically insert the correct code in the subject line for you (New order from {field_id= “3”}, for example).
Click Save when ready to save changes.
We also want to create an email notification for the customer, so click Add New Notification in the top-right corner.
Fill in the name of the new notification (customers don’t see this, so you can use any name you like), remove the {admin_email} from the Send To Email Address field, click Show Smart Tags, and select the Email field.
Go ahead and adjust the email subject, from Name and Email address, and the email message’s body.
Click Save when ready to save changes.
Food delivery confirmation message
WPForms shows a confirmation message when the customer submits the form successfully and you can adjust it via Settings > Confirmations. If you simply want to show the message – type the text in the text box. You can also redirect the customer to a thank you page by changing the Confirmation Type setting.
Food delivery payments
If you only accept cash on delivery, you can skip this section. However, if you want to provide customers the option to pay for the order online, read further.
We need to add special fields to our form and then connect it with the payment processor (PayPal or Stripe, for example).
Edit your form, go to the Fields tab and click Add Fields. Scroll down to Payment Fields and use any of the available fields (Single Item, Multiple Items, Checkbox Items, etc.) to replace the default field that lists prices on your form.
Make sure to include the Total field to calculate the total amount customer needs to pay. Simply drag and drop the Total field from Payment Fields on to your order form.
Click Save when ready to save changes.
Next, head to WPForms > Addons, choose the payment processor (PayPal or Stripe, for example), and click Install Addon under the desired payment processor.
In this example, we’ll use PayPal, so click Install Addon under the PayPal Standard Addon.
Head back to WPForms > All Forms, edit your form, click the Payments tab on the left and select PayPal Standard. Select the Enable PayPal Standard payments option to enable the payments feature.
Next, fill in your PayPal email address, set Mode to Production, and Payment Type to Products and Services. Since the customer already fills their address on the order form, we recommend configuring the Shipping option to Don’t ask for an address.
Click Save when ready to save changes.
The form will now automatically redirect customers to PayPal once they submit the order.
Add your food delivery order form to your WordPress website
Lastly, we have to add our food delivery order form to our WordPress website.
Head to Pages > Add New to create a new page, and fill in the name. Click on the + sign in the Gutenberg editor to add a new block, scroll down to Widgets, select WPForms, or use the search field to find it.
Once the WPForms block is added to the page, click the drop-down menu, and choose your order form. Adjust the other page options and click Publish to save it once ready.
That’s it! We recommend testing your form extensively to make sure it’s working properly, email notifications are coming, and that the payment processor correctly processes payments for your food deliveries.
