How to make a food ordering website with WordPress: Pages, forms, and more

Services like DoorDash and Grubhub have taken the food ordering world by storm, but they can be expensive for small businesses. What if you want to create a website for your restaurant and take orders without having to deal with those services?

In this article, you’ll learn how to make a food ordering website with WordPress. We’ll start by showing you how to create pages and add navigation.

Then you’ll learn how to create a food ordering form with Jotform that mirrors your menu. We’ll also talk about how to get notifications from the form submissions, how to embed forms on your site, and more.

Setting up a food ordering website can be a daunting task, but with WordPress and Jotform, it’s easy. So let’s get started.

Setting up WordPress

There are other options besides WordPress — like Wix — but we’re using WordPress because it’s the world’s most popular website builder. It’s also free and easy to use. Plus, there are plenty of themes and plug-ins to choose from if you want to change the look of your site or add features to it.

But before you get started, take a look at Wix. They make creating an attractive design even easier than WordPress does, and embedding forms is just as easy as with WordPress. However, WordPress is more established and will make getting information easier, which is why users recommend it.

To get started, you’ll need to find a service that hosts WordPress. While WordPress itself is free, hosting will cost a few bucks every month.

There are a lot of options, such as GoDaddy or Bluehost, but DreamHost is another good option (from personal experience). The plans are reasonable, and the service is easy to use.

Even though setting up WordPress with DreamHost is easy enough, it’s a process that’s a little too lengthy to explain in this article. Instead, you can find great instructions on DreamHost’s website.

Once you’ve set up your WordPress site, find your way to your WordPress dashboard. In DreamHost, you’d go to Websites > Manage Websites from the left menu. Then click the Manage button on your website’s card.

That will take you to a list of actions you can use to manage your website. Find the WordPress row and click Manage again.

That will open your WordPress dashboard in a new tab. The next step is to start creating your pages.

Creating pages and navigation

The first thing you’ll need to do is create some pages for your site. To do that, go to Pages > Add New from your dashboard. Change the title to “Landing Page,” and let’s begin.

Creating a landing page

Many restaurants make the mistake of focusing on vibe and artistry over functionality when it comes to their websites. That’s fine to help entice users to stay on your page, but most of the time, what they’re really searching for is a menu, hours, and your contact information.

It’s a great idea to make your website visually pleasing, but not at the expense of being functional. Make sure to put your menu, phone number, hours, and address in a prominent position on the front page.

You can either place your menu on your landing page or make it a separate page. Some restaurants choose to have nothing but a menu on the landing page. If your menu is nice enough, that may be all the advertising your site needs.

Adding elements to your page and designing it

This is another big topic that goes beyond the scope of this article. And depending on your level of expertise, it might even go beyond yours. If that’s the case, don’t worry.

One of the reasons we’re using WordPress is because it’s popular. That means there’s a massive community of people who’ve dedicated whole careers to mastering it.

If you’re sharp enough, you can google some “getting started with WordPress” articles or buy a book and learn the most helpful tips and tricks in a weekend. . And there’s always . But if tech just isn’t your thing, you can at least build some basic pages, plain text, and navigation.

After you’ve done that, you can hire someone to clean it up and make it nice for you. There are some very affordable designers out there, but remember, you often get what you pay for.

Whichever way you go, it’s definitely best to know the WordPress basics. If you want to make a quick change to prices or an item’s description, you should be able to do that yourself. It will save you a lot of money and hassle down the road if you don’t need to call a designer every time you notice a typo in the menu.

Creating more pages and navigation

When you’re done with the landing page, click Publish in the upper right-hand corner. Make sure visibility is set to Public and click Publish again. Then click the WordPress logo in the upper left-hand corner to go back.

That should drop you back in the Pages page of your WordPress admin site. Now click Add New at the top.

Name this one “Order Form,” publish it, and go back. Keep doing that until you’ve created all the pages you want.

You may want a separate menu and contact page, even if that info is on the landing page. Your goal here is make your site as easy to navigate as possible.

You might consider including these pages as well:

• About Us: Visitors are often interested in the history of old and quirky restaurants. This is a good place to share family info and the history of the establishment.
• Events: If you’re hosting events like live music on certain days, let your customers know.
• Blog: This is a great way to keep customers updated on specials, new menu items, and general happenings. You can also use it to attract new customers through Google searches via SEO.

Now that you’ve created all of your pages, it’s time to add some navigation. Let’s start by making the landing page an actual landing page.

From the dashboard, select Appearance > Customize. Then choose Homepage Settings. Click the radio button to make your homepage display a static page and choose Landing Page from the dropdown. Now click Publish in the upper left-hand corner, followed by the X right next to it.

Now let’s create a menu. Select Appearance > Menus. In the Menu Structure box, name your menu “Navigation,” click Primary Menu, and then click Create Menu.

Now check all of the pages you want to add to the menu from Add to Menu. If you don’t see a page you want to add, make sure you’re looking at the View All tab under the Pages section. Save the menu again when you’re done and go back to the dashboard.

There’s a house icon next to your site’s name in the upper left-hand corner. Hover over it and click Visit Site. If you haven’t changed your theme, your website should now show a navigation bar in the upper right-hand corner. Go ahead and click around to make sure that everything works.

Adding an order form

Now comes the easy part. We’re going to use Jotform to make an order form in minutes using one of its templates.

Jotform is the ideal tool to create an order form because it allows you to calculate the total amount, collect payment information, and get notifications with every new order.

You can start from scratch or pick from one of the several templates. Most of those are general purpose forms, but  as well. If you’re new to Jotform, using a template and changing it to suit your needs will be the easiest way to go, and that’s where  you should you start.

You can spend some time playing with your form now, but it’s not necessary. As long as you have a form, you can embed it into WordPress to keep this tutorial chugging along.

When you’re ready to work on your form,  to teach you everything you need to know. But most people can learn enough about Jotform by just clicking around and exploring the available options.

Once you’re happy with your form, go ahead and navigate to the Settings tab in the top toolbar. You can receive emails or mobile messages from Jotform. If you want email messages, here’s a link to show you how. And here’s how to set up mobile messaging.

Now let’s move to the third top tab, Publish. That will take you right to the Quick Share tab. Click the green Copy Link button and head back to WordPress.

Now go to your Order Form page. All you need to do here is paste the link. In a few seconds, your order form will be embedded. You can click Preview > Preview in new tab in the upper right-hand corner to see it in action — that’s the easy part.

Taking an even easier route: Creating a mobile app

Once your WordPress site is looking good, you can make things even easier for your customers. Jotform has a tool called Jotform Apps that can take your forms and turn them into mobile apps in minutes.

You can use Jotform apps to share all the same information you’re sharing on your WordPress site, like your hours, phone number, address, etc. If your menu is available as a PDF, you can add that as well. And, of course, you can add your order form to the app.

No download is required for your customers to get your app, and it looks great on mobile, making ordering easy and convenient.

You can include a link to your app using a QR code printed on your menus, and you can make it available on your website if you want. You can even add a link to your app right from the Google Maps and Yelp pages for your business.

So there you have it — an easy way to create a food ordering website with WordPress. Now all you need is some great food and a few delivery drivers.

Photo by rawpixel-com