Divi Hamburger Menu Tutorial: Part 2 – How to Add a Fullscreen Mobile Menu on Desktop with Divi

In Part 2 of this Divi Tutorial series on taking a Coded Design and turning it into a Divi Layout, we are going to show you how to make the Divi Mobile Menu show on Desktop with a fullscreen display. This will take a bit of CSS, so strap on in. The link to all the code used is linked below.We originally saw this layout and Navigation Menu on Reddit in /r/WebDev and loved it.In this 3 part tutorial, we are going to build out a Hero Section and Navigation Header that will display a mobile menu on the Desktop. We liked the punny thought of having a hamburger menu on a hamburger-themed layout.Part 1 is all about building out the Hero Section and using some of the Divi Transform and Animation effects to make it convert.We originally saw this layout and Navigation Menu on Reddit in /r/WebDev and loved it.Part 1 ☞ Building the Hero SectionPart 2 ☞ Add the Fullscreen Menu and force the Mobile Menu on desktopPart 3 ☞ Add jQuery to the Divi Fullscreen Menu to show hovered link as background textFollow one part, or all three, you can learn some valuable Divi Theme skills in each one.LINKS➤ Text Tutorial & Code @ https://diviengine.com/hand-coded-design-to-divi-layout-part-2-enabling-a-hamburger-menu-on-desktop/➤ Learn more about Divi Engine @ https://diviengine.com/➤ Get the Divi Theme @ https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=58998CHAPTERS00:00 Introduction01:02 Setting Up the Header in the Divi Theme Builder04:58 Styling our Global Header Elements12:26 Adding the CSS to Show the Mobile Hamburger Menu on Desktop17:30 Conclusion