Popups: How To Create A Fullscreen Menu

Creating Fullscreen menus is similar to creating Slide-In menus, to do that you need to use the Header Popups functionality of Divi MadMenu. 

1

First add a new  section to your header template, set its width to 100% and height to 100vh so that the section covers the entire screen. 

2

Then turn this section into a  popup by adding the same unique ID to this section and the MadMenu Button element that will be toggling the Fullscreen menu. This button's Popup Toggle Type must be set to Primary, all additional popup toggles targeting the same popup(in this case the Fullscreen menu) should be Secondary.

3

Apply the popup settings:  opening and closing animations, z-index, etc. 

4

Create the Close Button either by enabling the Popup Close Button in the Primary popup toggle settings, or use a different Divi MadMenu module Button element to create a Close Button by setting the same popup ID to it as well (the toggle type of this button must be set to Secondary).

5

After the Fullscreen menu popup settings are applied you need to add its content using any of the available modules and design the menu normally like any other Divi Builder section.

Watch this tutorial to learn how to create a  Fullscreen menu in more detail: