You are here: Home » WordPress Reviews » How to Start a Restaurant Website With Bon Appetite WordPress Theme

How to Start a Restaurant Website With Bon Appetite WordPress Theme

Bon Appetit is a brand new restaurant WordPress theme. The simple user interface and lots of customization options have made the theme a popular choice for the restaurant website. Along with parallax animation effects, the issue also features lots of advanced capabilities.

In today’s post, I will take an in-depth look at this excellent WordPress theme and introduce you to some of its useful and interesting features.

Initial Setup

When you first install the theme, you will be informed you that it needs some plugins including Visual Composer, Contact Form 7, Revolution Slider and Ultimate Add-ons for Visual Composer for working correctly.

Other than Contact Form 7, all the other plugins are included in the theme package.Once you have installed all the plugins, you can choose to import the demo content. To do that, go to Appearance -> Demo Import. Click ‘Import’. Depending on your server(s), this may take some time.

However, once the import process is finished, and all the required plugins are active, your dashboard will look like this –


Customization Options

Unlike other premium themes, Bon Appetit does not come with a long, confusing theme options section. Rather, all the customization options are listed in the default theme customizer section. To change various display settings, go to Appearance -> Customize from your website dashboard.

The ‘Site Title’ section lets you define the title and tagline of your website. Then, you can upload the logo in the ‘Header’ section. From the ‘Layout’ section, you can choose the color scheme. The available options include Orange, Red, Green and Default.’Typography’ section allows you to choose the fonts for your website. Besides the standard fonts, you can choose from more than 630 Google Fonts too.

‘Other’ section has the option to upload your custom favicon. This section also lets you show or hide the life customize feature. Enabling this will include a cog icon in the front end of your website. By using this icon, visitors can choose the color scheme and their desired font family.


In the ‘Footer’ section, you will find separate fields to link your social media platforms including Facebook, Twitter, YouTube, Pinterest, Google Plus, Instagram. You will also find a separate area to customize the footer text.

It is possible to put widgets in the footer. To do that, click the ‘Widgets’ section. Click the ‘Add a Widget’ button, choose the widget(s), update necessary settings and click ‘Save & Publish’.

Creating New Pages

With the help of Visual Composer, Bon Appetit has made designing new pages very easy. Whenever you are creating a new page, you can choose from the exiting layouts like landing page, CTA page, product, description, features, service list, etc.


And if that is not enough, you will find lots of other ready-made templates by clicking the ‘More Layouts’ button and then selecting the ‘Default Templates’ tab. You can use any of the available layouts directly or customize it according to your requirements.

It is also possible to create your designs. To do that, get back to the post editor and click ‘Add Element’. You will be provided with a huge list of elements.


While the default view displays all the available elements, you can filter them by using the links on top. Most of the elements have a short description, which will help you to understand the purpose of that element. Some interesting elements include Tweet button, Pinterest button, Video Player, Google Maps, Flickr Widget, Pie Chart, Flip Box, Modal Box etc. You will also find elements for popular WordPress plugins like Contact Form 7, Revolution Slider.

Each section of your page could be dragged and dropped into another position. Once you have included all the necessary elements, you can save your template. To do that, click the ‘Templates’ icon. Make sure you are in the ‘My Templates’ tab. Provide a name for your template and click ‘Save Template’.

You will also find the column creator feature very useful. Besides providing all the common column-based layouts, this feature lets you create your layouts. There are also dedicated icons for various actions like delete, edit, clone, toggle, etc.

Below, you will find a separate section titled ‘Page Options’. This section lets you customize the look of the page by providing options to select the width, toggle page header, toggle header separator, header background image, background color, menu location, etc. By the way, the theme supports only one menu. And the menu is located in the header.

Adding Restaurant Menu

Bon Appetit allows you to create menus by including your currently available dishes. And the theme installs a new custom post type for adding dishes. To add a new dish, go to Dishes -> Add New. In the resulting page, provide the title and description of your dish. You can also choose tags and categories and provide a featured image for the dish.

In the ‘Options’ section, you will find options to provide the price and currency for the dish. After providing all the necessary information, click ‘Publish’.


In order to create a menu, open a new page. Go to the new element adding a screen and find out the elements titled ‘Dishes’. Click on the element to add it to the page. You will be provided with a settings window like the following –


First of all, select the view style from the drop-down menu. You have four options here – Default, Grid, Large and Tiles. If you select the default option, you can choose the default view, configure additional options like the dishes view, number of columns etc.

The next options let you choose the currency position, anchor navigation. You can also choose to display only selected dishes in the menu. To do that, check the ‘Enable’ in the Filter by Tags section and then, select the tags you want to use.

After making all the changes, click ‘Save Changes’ and publish the page. As you can see, Bon Appetit makes creating menus for your website very simple. Once you create a dish, it is possible to include in any menu. It is also possible to display dishes separately. To do that, select the ‘Dish’ element in Visual Composer.

Bon Appetit also has dedicated elements featuring various display styles. You will find details of STM Dishes – Tabs, STM Dishes – Columns, STM Dishes – Anchors, STM Dishes – Grid, STM Dishes – Large, STM Dishes – Tiles etc. in the elements list. Once you become familiar with the various display styles for menus, you can use any of these specific display elements and make your menu more attractive by using advanced customization options.

Creating Slideshows

As the theme includes Revolution Slider, you can easily create stunning slideshows for your website. In order to create a new slideshow, click the ‘Revolution Slider’ link from your dashboard and click ‘Create New Slider’ on the next screen.


In the next screen, provide a title and alias for the slideshow. You will find all the customization options listed on the right side. After making the necessary changes, click ‘Create Slider’.

At this point, you will be taken to the slider listing page. Click the ‘Edit Slides’ link for the slideshow you just created. In the next screen, click ‘+ New Slide’. Upload the images you want to use in the slideshow and click ‘Insert’. Selected images will be added to your slideshow. You can rearrange the images by dragging and dropping the arrow buttons located on the right.

Then, get back to the page where you want to use the slider. Go to the new element screen of Visual Composer. Select the item titled ‘Revolution Slider’. You can provide a title for the slideshow. Select your desired slideshow from the drop-down menu and click ‘Save Changes’. The slideshow is now added to your page.


It is also possible to import slideshows from other websites that are also using Revolution Slider. To do that, export the slider from the website first. Then, get back to your website dashboard, go to the ‘Revolution Slider’ page and click ‘Import’. After uploading the file, you can use the slider in your website or update the settings.

Other Features

As the theme is developed on Bootstrap, it works perfectly in any screen size including mobile, tablet, laptop and desktop. It does not matter what the user’s devices are, Bon Appetit guarantees that they will not miss any part of your website.

The theme is also fully compatible with WPML. Which means you can easily translate it into other supported languages. It follows all the coding best practices too. Therefore, your site’s performance will be excellent, and you will get exceptional SEO results too.

Besides the regular Visual Composer elements, the Brainstorm plugin adds lots of additional features. You can control them from the Brainstorm -> Modules page. From that page, you can enable or disable any element.From the ‘Advanced Settings’ tab, you can choose to allow animation in mobile devices and smooth scrolling for your site.


Final Words

Bon Appetit comes with everything necessary for creating a modern, feature-rich restaurant website. By including multiple premium plugins in the package, the theme lets you control every aspect of your website in a simple and straightforward manner. If you are looking for an appropriate theme for your next restaurant website, this should be one of your top choices.

Editorial Staff at Web Loggerz is a team of Web Technology lovers led by Ansh Gupta.

Leave a Reply

Your email address will not be published. Required fields are marked *