Tutorials

Build a Header, Menu & Mega Menu

1. Installation & Overview

Learn how to get started with Mhmm. Also, learn how to setup a Header & Menu.

2. Create Header & Menu

Create an Inline Menu for Desktop and a Hamburger Menu for Tablet/Mobile. Learn how to set a custom breakpoint to switch to Tablet / Mobile view.

3. Headers per Page & Devices

Learn how to have different Headers per device using Divi’s default breakpoints for Desktop, Tablet & Mobile.

4. Create a Mega Menu

Create a Mega Menu using a Layout Pack from Elegant Themes. Also learn how to set up the Mega Menu Hamburger Icon & custom options.

Featured Tutorials

Swap Menu per Page

Easily swap your menu and/or Logo per Page. Great for unique Landing Pages!

Swap Menu per Device

Easily swap Menu and/or Logo on Desktop, Laptop & Mobile.

Multiple Header Options

Including Scroll, Stick to Top, Stick to Bottom, Start at Bottom and Stick to Top on Scroll, and more.

Hamburger Menu Options

Multiple Hamburger Locations & Options including Color & Hover Color.

Simple Alignment & Submenu Transitions

On desktop, easily center your Inline Menu vertically in your Header. We’ve also included a nice sliding submenu transition to Hamburger Submenus.

Total Font, Padding & Margin Control

Use Divi’s font picker to find the perfect font settings for your Menus. Control Horizontal Spacing for Inline Menus & Vertical Spacing for Hamburger Menus!

Stop Stacking

Prevent Divi’s default stacking of Columns on Tablet & Mobile with the included “Stop Stacking” Module Plugin.

Create Mega Menus

Easily craft Mega Menus with Opt-ins, Blurbs & any Divi Module.

Extra CSS Areas

For advanced CSS customizations, we’ve added additional CSS fields in the Module’s Advanced settings area.

Change Header Color on Scroll

Learn how to change the background color of your Header on scroll using code with Mhmm.
Demo »
Download Code »

Dropdown Menu Fix

In an update, we fixed the menu from flying off the end of the page by adding the CSS class “mhmm-right” to the parent menu item.

WooCommerce Cart Icon & Count

Add a WooCommerce cart icon in your menu by adding the CSS class “mhmm-cart” to that menu item. The cart count will be updated automatically.  =)

Disable Sticky Menu for Tablet & Mobile

Learn how to disable Mhmm’s sticky menu for Tablet & Mobile.
Download Code »

“Mhmm. changes the game. Being able to create custom Headers, Menus & Mega Menus is amazing. Being familiar with the Divi Builder, I can create my custom Header & Menu extremely fast. I also love that I can have a different Menu for a Landing Page.”

John Wooten

Web Designer

“I've built 100+ websites with Divi. I absolutely love the Divi Builder & the flexibility it offers. Now with Mhmm., I can take my site's Header & Menu to the next level! With the ability to build the Header & Mega Menus with the Divi Builder, the options are truly endless.”

Jake Kramer

Web Designer

Incredible Support

Customers rave about Superfly’s support. If you have any troubles with Mhmm. Mighty Header & Menu Maker, our support team has your back.