How to Add Mega Menu on WordPress Website? (Step by Step Guide)

How to Add Mega Menu on WordPress Website? (Step by Step Guide)

If you are looking to upgrade the default WordPress menu and make it more beautiful, well organized, effective and easy to navigate then, you are at the right place. Here, in this article, we will discuss a short tutorial of how to add a mega menu on your WordPress website using a free mega menu plugin – AP Mega Menu. But before we begin, a few things about adding a mega menu on your WordPress website make the navigation easier and effective.

A mega menu is an expandable multiple-dimensional navigation structure where you can store lots of site’s contents and various rich media (images and videos). It not only lets your visitors find their required contents easily and quickly but also provide them with a unique navigation experience. By doing so, you can keep your visitors for a long period of time on your website that not only decreases the bounce rate but can also boost the engagement rate and conversion rate.

Adding Mega Menu on WordPress Website

Now let’s begin this step by step tutorial and add a beautiful mega menu on your WordPress website.

AP Mega Menu: Brief Description

AP Mega Menu

AP Mega Menu is one of the popular free WordPress plugin for adding an engaging mega menu on your WordPress website. It comes with 8 pre-available skins and a custom template builder to designing a unique mega menu for your website.

Major Features of AP Mega Menu Plugin

  • Supports Flyout or Mega Menu Submenu Styles
  • Widgetized Mega Menu with Visual Builder
  • 8 Pre-Available Menu Skins
  • Option to Design Custom Menu Templates
  • Mega Menu with Horizontal or Vertical Orientation
  • Fade or Slide Transition Effects
  • Hover or Click Trigger Effects
  • Option to Custom Menu Icons

Live Preview  Full Details  Download  Premium Version

Installation and Activation

Download AP Mega Menu plugin from WordPress.org repository for free. Then, install it on your website. After that, activate it. If you have any difficulties regarding the plugin installation then, you can take the help of its documentation.

Configuration: AP Mega Menu

After you have successfully activated the plugin on your WordPress website. You will see “AP Mega Menu” appear on the left menu of your dashboard. Click on it to proceed.

General Settings

You will land to the “General Settings” tab. Here, you can set the behaviour of the mega menu along with the animation labels. Also, you can configure the mobile settings of your menu by setting up the toggle behaviour and menu open and closed icons.

AP Mega Menu: General Settings

Image Settings

Here, you can set the display size of your image on your mega menu. Also, you can set the width of the custom icons that you have inserted on your menu.

AP Mega Menu: Image Settings

Shortcodes

Here, you can generate the shortcodes for the mega menu. Just copy the shortcode and paste any page, post or custom post types of your WordPress website to display the mega menu.

AP Mega Menu: Shortcodes

Theme Settings

Using this plugin, you can create custom templates for mega menus. Go to AP Mega Menu > Theme Settings to create a unique template your mega menu.

AP Mega Menu: Custom Template Options

Adding Mega Menu as Main Menu

To add the mega menu as the main menu of your WordPress website, go to Appearance > Menus. Here, you will find “Select AP Mega Menu Settings”. Enable it. Then, assign the orientation of your menu, choose the triggers, transitions and skins.

AP Mega Menu: Adding WordPress Menu Using AP Mega Menu

The plugin also contains options to configure each of the menu categories separately. To configure the category, hover over any of category and click on “AP Mega Menu” button that appears upon hovering over.

AP Mega Menu: Category Wise Configuration Options

For additional features, you can upgrade this plugin into its premium version – WP Mega Menu Pro.

Wrapping Up

In this way, you can add mega menu on your WordPress website in few minutes. So, if you want to add mega menu on your website then, you can follow this step by step tutorial.

You can also check out the collections of:

8degree themes black friday cyber monday deals