QuadMenu is a WordPress mega menu plugin made for general WordPress users and developers alike. It's the leading product offered by upcoming developer QuadLayers. In our QuadMenu review we'll have a look at this plugin which is inching its way to stardom within the WordPress community.
This plugin comes in free and premium versions and offers integrations with some of the most popular themes available in the WordPress industry. This includes Divi, Avada and OceanWP. We'll now dive deeper into the QuadMenu plugin, starting with some of its best features. Let's get started.
- QuadMenu plugin overview
- Installation & configuration
- Adding content to your menu
- Customizing your menu
- Developer options
QuadMenu plugin overview
You probably already know what to expect from a mega menu in general, so let's start this QuadMenu review by going over the specific features this mega menu plugin has to offer.
- Multiple Styles – In addition to the classic dropdown menu, this plugin allows you to add expanded dropdown menus featuring your shop, widget areas, your blog, tabs and a carousel.
- Position – Horizontal menus are most popular in terms of position, but you can also create vertical menus in accordion or paneled layouts with this mega menu plugin.
- Integrations – QuadMenu integrates with all themes through automatic and manual integrations depending on whether or not your theme supports theme locations. However, this plugin also offers official integrations for Divi, Avada, Storefront, OceanWP and Astra.
- Customizable – Create an unlimited number of themes by changing layouts and selecting different colors for the background and text.
- Drag & Drop Editor – Build and edit the overall layout/content your menu uses with the built-in, drag-and-drop editor.
- Built-In Widgets System – I mentioned this earlier, but this plugin comes with a built-in widgets system that allows you to add WordPress widgets to your menu.
- Elements – Add elements to your mega menu for a login form, a live cart preview and a search module.
- Developers – There are specific options for developers that allow you to customize certain aspects of the plugin and even change specific files. The documentation also features guidelines for theme authors who want to integrate QuadMenu directly in their themes.
Let's continue this QuadMenu review and get into how it feels to actually use this plugin.
Installation & configuration
This mega menu plugin does have a free version, so you can install it directly from the WordPress dashboard with ease.
You'll see your theme's menu locations in the Options tab under the Configuration section. Here are a couple of examples using our own theme MH Magazine lite theme as well as Twenty Seventeen.
All you need to do is switch the Integration setting to On to activate QuadMenu for individual menus in most cases. You can see the code snippets generated for you in the screenshots above if the automatic integration doesn't work. I had no trouble getting it to work for MH Magazine lite, however, so it should be a fairly seamless integration.
Adding content to your menu
Adding content to your menu with QuadMenu is a breeze and highly familiar as it uses the same page the native menu builder uses in WordPress. You'll select the sections you want to add to your menu from a dropdown menu located on the right-hand side of the page just as you would when building an ordinary menu with WordPress.
The only difference is you'll stick with the QuadMenu Items list, so instead of placing a generic link to your Blog page, you'll use the Mega, Tabs or Carousel items to showcase your latest content, categories, and more. You can treat it like any other menu item and give it a proper name so users don't get lost while navigating your site. You'll then use widgets to actually add the content, making this process even more familiar.
Other aspects you can edit for individual items are the URL the label uses and any classes/attributes you want to add to the item. You can also add a “Subtitle” or “Badge” (or both) to menu items. A subtitle is a short blurb that displays underneath the menu item label in a smaller font while the badge is a colorful label you can add to it.
This is a great option for shops as it allows you to add “New”, “Hot” and “Sale” badges to menu items. You can even add icons and make a few cosmetic changes from this section, such as adding an image as a background for the dropdown menu. You already know what widgets your site has, so here's a complete list of the items you can add to your menu:
- Mega – Add multiple widgets to your menu with the Mega menu item. You'll use columns to accomplish this.
- Icon – If you'd prefer to display an icon for a certain menu item, such as using an icon of an envelope in place of a “Contact” label, use the Icon menu item.
- Cart – Add a cart icon, complete with your order's total and a dropdown menu that previews your cart, to your menu.
- Search – Add a search icon to your menu, which expands into a search bar when clicked.
- Social – This adds what has become known as the “share icon” to your menu. Instead of allowing users to share the web page, it'll showcase links (brand icons) to your social media accounts.
- Login – Allow users to register and/or log in to your site with ease by placing a Log In item in the menu.
- Tabs – Same as the Mega menu item, only this one allows you to use tabs, essentially allowing you to add multiple mega menus to a single menu item.
- Carousel – Same as the Mega and Tabs menu items, only this one uses a carousel.
Let's get into customization in this QuadMenu review.
Customizing your menu
You'll create custom styles for menus by creating what the developers of this plugin have named “themes”. Every new installation comes with a Default Theme that cannot be deleted. You can make things easier on yourself by customizing this theme.
The main settings page allows you to change the layout from horizontal to vertical as well as flip the alignment for the logo and menu. It also allows you to configure several different options that affect the way your menu appears as well as the way users interact with it. This includes selecting a hover effect, adjusting the menu's width, turning the Sticky setting to On and changing the way the dropdown menu is triggered.
The rest of the customizations are broken down into five tabs:
- Menu – This is where you'll edit basic styles for the navigation bar as a whole. The QuadMenu logo is added to your menu by default, but you can change or remove it in this section. You can also change the menu's main colors and technical settings, such as margins.
- Mobile – QuadMenu does work on mobile, and this section features a small collection of settings that allow you to hide the mobile menu, change its color scheme and more.
- Sticky – This is an even more smaller collection of settings that allow you to change the way the sticky menu appears should you decide to use it.
- Dropdown – This tab features a lot of the same settings you'll see on the Menu settings page. This is because these settings affect the way the dropdown menu appears as opposed to the entire menu as a whole.
- Typography – Change fonts and font sizes of general text, menu text and subtitle text, and yes, Google Fonts are supported.
Let's go over the developer options this plugin offers before we wrap this QuadMenu review up.
It's entirely possible to design and build a menu with simple drag-and-drop actions with this plugin, but developers will be delighted to learn that this plugin was also developed with other developers in mind. You can change any default value by hooking into them, for starters. It's built with LESS, and with it, you can also hook into and change the following:
- Menu Items – Add your own.
- CSS Animations – Add changes to the theme's CSS animation effects.
- LESS Files – Add your own settings by hooking into and changing the path of LESS files.
You can also create what the plugin has called “Developer Options”. When added, users won't be able to change settings you designate are for developers' eyes only.
QuadMenu review: Final thoughts & pricing
QuadMenu is an impressive plugin that's easy to use yet highly effective in its ability to create a stunning WordPress mega menu. The base plugin is free but excludes things like the login and social media elements as well as the Tabs and Carousel menus. The first premium plan is available for $18 while the $50 plan gives you access to priority support.
- Laptop / Coding: StockSnap / Pixabay.com