DIVI

ULTIMATE HEADER PLUGIN

CUSTOM HEADER DESIGN

+ SLIDE IN MOBILE MENU

FOR DIVI 4 & DIVI 5

**This product is only available as part of Divi.Help All Access Pass.

01.

GLOBAL DIVI CUSTOM HEADER

12 premade custom DIvi header designs to choose from.

Divi Ultimate Header Plugin allows you to replace the default Divi header & navigation globally with one of our premade custom Divi header design in a single click. This is a great start to design a website that doesn’t look like the same old Divi website. Plus, you can also make the custom menu sticky / fixed on scroll. Want to see it live in action? This website uses one of the premade custom Divi header design. See it in desktop for full design. In mobile view, it will revert back to use the default Divi header. This is particularly useful if you wish to have fullscreen or slide in menu in mobile only.

02.

EDIT IN DIVI BUILDER

Edit the logo, color, etc. right in the Divi Builder.

After you choose your desired Divi header styling in the Theme Customizer, you can then proceed to the Divi Library to edit the custom Divi header design right in the Divi Builder. You can add new modules, change the layout, logo, color , etc. If you wish to create a totally custom Divi header design (apart from our premade header design), you can always use our premade one as a starter design & customize it to your liking & set it as the custom header styling in the Theme Customizer.

03.

STICKY / FIXED MENU

Easily make your menu section to be sticky / fixed.

In Divi Ultimate Header Plugin, we added a custom sticky JS to allow you to easily make your menu section to be sticky with a CSS Class. Our custom sticky JS supports up to 5 different sections to be sticky on top of each other. To see it in action, check out this website / demo site on desktop view.

04.

SLIDE IN / FULLSCREEN MOBILE MENU

More variety for your mobile menu.

In mobile, Divi Ultimate Header Plugin will revert back to use the default Divi mobile header, so that you can have slide in / fullscreen menu in mobile. Though, you can still have custom header elements below the default Divi mobile header. If you choose to use Divi Builder for your mobile menu, you can only get to have the default slide down style. And that’s why we came up with this way, so that you can more variety to your mobile menu.

05.

MENU HOVER STYLE

Choose a premade hover style for your menu.

Divi Ultimate Header Plugin also allows you to add hover effect to the fullwidth menu in a single click. You can easily tweak the hover effects & the colors right in the Theme Customizer. No CSS code required. Want to see it live in action? Take a look at the menu on this website. We used one of the premade menu hover style, which added a line animation hover effect to the fullwidth menu. Also take a look at the demo site with different hover styles set.

06.

VERTICAL NAVIGATION

It’s now possible to have vertical navigation as your custom Divi header.

In the latest v3.0, we added support for Vertical Navigation + collapsible menu. We made 2 premade styles to get you started (Style 11 & 12). For the custom Vertical Navigation, when it’s below the breakpoint, it will switch into an overlay navigation that’s triggered by hamburger menu on click. Check out our demo style 11: https://header-demo.diviultimate.com/style-11/. We also added tons of new options for Vertical Navigation in Theme Customizer: custom width, custom breakpoint, option for no breakpoint, overlay navigation trigger styles, triggered background color, hamburger menu color & menu hover styles. For ‘no breakpoint’ example, check out our demo style 12: https://header-demo.diviultimate.com/style-12/

07.

SET DIFFERENT HEADER PER PAGE

Ability to set different header design on per page basis.

Sometimes, you might want to have different header design for a specific page. In version 2.0, we added a new feature that allows you to set different header design on per page basis. You can also choose to revert back to original Divi header on specific page. This is particularly useful if you wish to have separate header design for your landing page.

READY TO SPICE UP YOUR DIVI HEADER DESIGN?

GET DIVI.HELP ALL ACCESS PASS