How To Show A Different Divi Navigation Menu On Desktop, Tablet, And Phone

Adjusting Your Menu Items Based On Visibility Options
- Duplicate Modules With Visibility Options
  - Is This Method Okay?
Conclusion

Adjusting Your Menu Items Based On Visibility Options

In certain cases, displaying a special Divi navigation menu on mobile devices may be necessary. You need to display different menu items or an alternative item order than the desktop version. If you’re unsure about the most effective method for accomplishing this in Divi, there are several options to explore. In this tutorial, we will show you how to display a different WordPress navigation menu for desktop, tablet, and phone devices within Divi.

Duplicate Modules With Visibility Options

An easy way to show a different menu per device is to duplicate the Menu module or section and hide and show them using visibility options in Divi. To do this, you first need to create separate menus in WordPress. Go to your WordPress Dashboard>Appearance>Menus and create different menus if needed. You can name them like Desktop Menu and Mobile Menu to make them easier to understand.

Afterward, go to Menu or another section containing your Menu module and open the module or section settings to the Advanced tab>Visibility toggle. There you will see checkboxes for Desktop, Tablet, and Phone.

For the menu, you only want to show on the Desktop, select the checkboxes for Phone and Tablet, since the selected options will be hidden. And inversely, if you only want to show a menu on a Phone and Tablet, you would select the checkbox for Desktop.

Is This Method Okay?

Although this method may appear effective for menus, it may be suitable for other types of content.

Conclusion

It is extra easy to create different content for different devices with the Divi Theme. Elegant Themes created a full guide on how Divi responsiveness works. We will advise you to check it out!

Divi Mobile Settings ➝ Learn more about this topic!

Try Divi Areas Pro today

Sounds interesting? Learn more about Divi Areas Pro and download your copy now!
Many pre-designed layouts. Automated triggers. No coding.

Click here for more details