How to Create a Custom Menu for Your Website Using Jet Menu

In this tutorial, we will guide you through the process of creating a custom menu for your website using Jet Menu. We will focus on adding a desktop menu, styling it to match your website, and integrating mega menu content. With Jet Menu, you can easily add a footer to your menu, which remains constant as you navigate between pages.

Preview of the Final Menu

Before we start, let's take a look at the menu we will be building. We have added a hamburger icon, a few pages, and categories. You can add mega menu content, as shown in the women's collection category with an image gallery.

Steps to Create a Custom Menu Using Jet Menu

Follow these steps to create a custom menu using Jet Menu:

Step 1: Create a New Menu

1. Log in to your WordPress dashboard and navigate to the Appearance and Menus section.
2. Click Create Menu to create a new menu.
3. Name the menu and click Create Menu.

Step 2: Add Pages and Categories to the Menu

1. To add pages to the menu, select the pages you want to add from the Pages tab and click Add to Menu.
2. To add categories to the menu, select the categories from the Categories tab and click Add to Menu.
3. You can add subcategories to a category by dragging them under their parent category.
4. To add custom links, select the Custom Links tab and fill in the URL and Link Text fields.
5. Scroll to the bottom of the page to select the menu location, and click Save Menu.

Step 3: Add Mega Menu Content

1. Click on the Settings icon for the category you want to add mega menu content to.
2. Select the Use Mega Content option and click Edit.
3. Add a heading for the category.
4. Add a divider to the menu entry.
5. Add a navigation menu by searching for nav in the widgets section and selecting the desired navigation menu.
6. Add an image gallery by searching for gallery in the widgets section and customizing the gallery settings.
7. Turn off the mobile trigger to avoid the hamburger menu within hamburger menu issue.
8. Change the navigation menu style from horizontal to vertical.
9. Click Update to save the changes made.

Step 4: Add a Footer to the Menu

1. Navigate to the Templates section and select the footer template you created.
2. Go back to the menu and click on the hamburger icon to edit its content.
3. Add the footer to the 'After Items Template' section, and click Update.

Step 5: Customize the Menu

1. Change the menu icon from a wide selection.
2. Customize the menu color, container width, padding, and border.
3. Add an item icon or badge for your menu items.

Conclusion

Jet Menu is a flexible and easy-to-use plugin that allows you to create custom menus for your website easily. You can add pages, categories, and custom links to your menu and incorporate mega menu content to enhance user experience. The steps discussed above will help you create a custom menu using Jet Menu efficiently.