Divi MadMenu Header Template #11: Horizontal Slide-In Menu

by | Aug 17, 2021 | 0 comments

The Divi MadMenu Header Template #11 is now available for download for all our customers that have purchased the Divi MadMenu extension.

It’s a horizontal header layout with the horizontal menu bar sliding in from top on the menu hamburger icon click.

Unlike the first 10 header layouts this header is created using not only the Divi MadMenu module but other native Divi Builder elements as well thanks to the Header Popups feature update released recently.


Main Features


Horizontal Slide-In Menu

Clicking the hamburger icon reveals the horizontal menu sliding in from top.


Close on outside click

The Slide-In horizontal menu and the mobile dropdown menu close if you click somewhere outside of their boundaries.


Menu close button

The Slide-In menu has a Close button (the X button) for closing the menu.


Horizontal menu on all devices

The horizontal(desktop) menu is enabled on all devices.


Responsive design

The menu template is designed with responsiveness in mind.


Different menus for each device

The horizontal(desktop) menu is assigned different menus for each device(desktop and phone), you’ll need to create those menus in the Appearance->Menus.


Both desktop & mobile menus enabled

Both the Desktop and Mobile Menu elements are enabled on mobile devices.


Toggle mobile submenus on click

The mobile menu nested menu items are expanded/collased by clicking the parent menu item’s arrow icon.


Accordion mode enabled

The Accordion Mode is enabled for the mobile submenus allowing to have only one expanded submenu at a time.


No Custom Code Used!

This header template does not use any custom code. It is fully customizible using the Divi MadMenu settings (and other Divi Builder elements used) in the Divi Theme Builder.

How To Download and Install

Please follow this guide about how to download the Header Template #11, it is included into the same file with the rest of the Divi MadMenu header layouts.

The installation of this header template is different from the installation of the previous 10 header layouts (which you first need to import into the Divi Library and then add to the header template as a section from the library).

This header template should be imported into the Divi Theme Builder as a new template, please follow this guide about how to import Divi Theme Builder templates.

View Live Demos & Get Divi MadMenu

Download FREE Divi Sections

Subscribe To Our Newsletter

Join our mailing list to download Divi freebies and get notified of our discounts, latest news and updates.

You have Successfully Subscribed! Please confirm your email address.

Divi MadMenu Coming Soon!

Join our mailing list to get notified when the Divi MadMenu module is released! Check out the sneak peek...

You have Successfully Subscribed! Please confirm your email address.

Free Download Divi Section Layouts

Download 19 ready-to-use Divi templates for FREE!

You have Successfully Subscribed! Please confirm your email address.

Black Friday Is Coming!

Subscribe to get notified when the biggest SALE starts!

You have Successfully Subscribed! Please confirm your email address.

Pin It on Pinterest

Share This