Divi MadMenu - Advanced Divi Menu Module 1.9.9

Divi MadMenu is a third-party extension for the Divi Theme Builder designed to overcome the limitations of the default Divi Menu module. While the native Divi menu is often restricted in terms of layout and mobile flexibility, MadMenu allows you to create highly complex, professional headers with multiple elements in a single module.

🚀 Key Features and Capabilities

What makes MadMenu "Advanced" compared to the standard Divi module is its ability to handle multiple elements and responsive behaviors independently:

7 Elements in One Module: You can enable and style a Logo, Desktop Menu, Mobile Menu, Search icon, WooCommerce Cart, and two CTA buttons—all within the same module settings.

Responsive Breakpoints: Unlike the default menu, you can set a custom pixel breakpoint (e.g., $1024px$ or $980px$) to decide exactly when the desktop menu switches to the mobile "hamburger" menu.

Mobile Flexibility:

Collapsible Submenus: Prevent long mobile menus from taking up the whole screen.

Accordion Mode: Only allows one submenu to be open at a time.

Clickable Parent Links: You can choose whether clicking a parent item opens the submenu or follows the link.

Fixed Header Control: It includes built-in settings for a fixed (sticky) header, allowing you to change the logo, colors, and height once the user starts scrolling.

Slide-In & Fullscreen Menus: It supports modern navigation styles like off-canvas slide-ins and beautiful fullscreen overlays without needing extra plugins.

WooCommerce Integration: Displays cart item counts and totals with AJAX live updates.

🛠️ How to Use It

To get the most out of MadMenu, it is best used within the Divi Theme Builder:

Installation: Install it like any WordPress plugin (Plugins > Add New).

Theme Builder: Go to Divi > Theme Builder and edit your Global Header.

Add Module: Search for "MadMenu" in the module list.

Content Setup: * In the Elements tab, toggle on what you need (e.g., Button 1, Search, Cart).

In the Layout tab, you can reorder these elements (e.g., Move the logo to the center or the buttons to the far right).

Design: Each element has its own dedicated design settings for spacing, fonts, and colors for both "Normal" and "Fixed" states.

⚖️ Comparison: MadMenu vs. Default Divi Menu

Feature

Default Divi Menu

Divi MadMenu

CTA Buttons

No (Requires separate module)

Yes (Two built-in)

WooCommerce Cart

Limited

Advanced (Total, Count, AJAX)

Mobile Breakpoints

Fixed at 980px

Fully Customizable

Mobile Submenus

Always expanded

Collapsible / Accordion / Slide-out

Element Ordering

Static

Responsive Reordering

Fixed Header

Basic

Advanced (Change logo/styles on scroll)

Note: Divi MadMenu is primarily a header tool. It works best when you want to create a "Header 2.0" experience that includes more than just links (like a "Login" button and a "Search" bar) in a single, cohesive row.

Would you like me to help you design a specific header layout using MadMenu, or perhaps explain how to set up its Slide-In menu feature?