You can easily create a Slide-In menu using Divi MadMenu Header Popups feature.

Technically it is simply a popup aligned to one of the sides of the screen and with the Slide In and Slide Out animations applied to it.

Create the Slide-In menu

To create a Slide-In menu first add a new section to your header template, set its height to 100vh (because it needs to be stretched from top to bottom of the viewport) and set its width to your desired value (eg.: 200px).

Then turn this section into a popup by adding the same unique ID to this section (in Section Settings -> Advanced -> CSS ID & Classes -> CSS ID) and the MadMenu Button element that will be toggling the popup (the Button uses this ID as a reference to the popup).

Next set its location to the desired side of the viewport and apply the appropriate opening and closing Slide animations.

For example, if you align the Slide-In menu to the right side of the screen then normally you’d set the Slide In Right and Slide Out Right animations as its opening and closing animations respectively.

However, you can set any other location and animation combinations as well.

Add the Slide-In menu content

After the menu section is configured to slide in and slide out on button click you will need to add its content.

Since it is just a normal section element, you can add content using any of the available modules and design it normally like any other Divi Builder section.

And that’s all, you have a full featured Slide-In menu!

Horizontal Slide-In menu

You can create not only vertical but horizontal slide-in menus as well using the same method, the only difference will be the location and the Slide animations directions (Top, Right, Bottom or Left).

Hope this tutorial is helpful, let me know if you have any questions in the comments section below.

View Live Demos & Get Divi MadMenu

Download FREE Divi Sections