How to Make Parent Pages Link in Divi Mobile Menus

One of the most common frustrations when building sites with Divi is discovering that parent menu items — the ones with dropdown children — don't behave as clickable links on mobile. Tapping a parent item on a smartphone either opens the submenu or does nothing, depending on how the menu is configured. This isn't a bug. It's how most mobile navigation is designed by default, but Divi gives you several paths to change it.

Why Parent Items Don't Link by Default on Mobile 📱

In most navigation systems, including Divi's, parent menu items serve a dual purpose: they're both labels for a group of child pages and potential links in their own right. On desktop, hovering over a parent reveals its dropdown while still allowing a click to navigate. On mobile, there's no hover state — a tap has to do both jobs at once.

Divi's default behavior resolves this conflict by treating a tap on a parent item as a toggle action: it opens or closes the submenu rather than following the link. This protects usability for visitors who need to reach child pages, but it blocks access to the parent page itself.

The result is that users who want to visit /services directly — not just browse its subpages — can find themselves stuck.

The Core Methods for Making Parent Items Clickable

1. Adding a Duplicate "Home" Link Inside the Submenu

The simplest approach that requires no code or plugins is to manually add a duplicate link as the first child item in each dropdown. For example, under a "Services" parent, you'd add a child menu item also labeled "Services" (or "All Services") that points to the same URL as the parent.

This works on every device, requires no technical knowledge, and is completely controllable from Appearance → Menus in the WordPress dashboard. The trade-off is that it changes the visual structure of your menu and adds an extra item to each dropdown.

2. Using Divi's Built-In Theme Options

Divi's Theme Customizer and Theme Options panel include settings related to mobile menu behavior. Depending on your version of Divi, you may find options under:

  • Theme Customizer → Header & Navigation → Mobile Styles
  • Divi Theme Options → General → Navigation

Some versions of Divi include a setting that controls whether parent items are links or toggle-only in mobile view. If yours does, enabling this setting is the cleanest solution. Check your installed version — this behavior has been adjusted across Divi updates, and what's available varies.

3. CSS and JavaScript Customization

For developers or users comfortable with code, the behavior can be overridden directly. The approach generally involves one of two techniques:

CSS pointer-events override: Forcing the parent anchor element to receive click events even when Divi's JavaScript would otherwise intercept them. This is a lighter touch but can produce unpredictable results if Divi's JS still fires on tap.

Custom JavaScript: Modifying or replacing the event listener that Divi attaches to parent menu items on mobile. This gives full control — you can define exactly what happens on first tap (navigate) versus second tap (toggle submenu), which is a pattern some developers implement as a double-tap logic: first tap follows the link, second tap opens the dropdown.

Code-based approaches are inserted via Divi → Theme Options → Custom CSS, a child theme's functions.php, or a plugin like WPCode. The right placement matters for performance and update safety.

4. Third-Party Plugins

Several WordPress plugins specifically address mobile menu behavior for themes including Divi. These typically add options like:

  • Click-to-follow on parent links
  • Separate toggle arrows (a chevron icon handles the dropdown, while the label itself remains a link)
  • Mega menu replacements with full mobile link support

The separate toggle arrow pattern is arguably the most user-friendly solution — it visually separates "navigate to this page" from "open this dropdown," removing ambiguity for visitors entirely. Some plugins add this without touching your theme files.

Variables That Affect Which Approach Fits Your Setup

FactorWhy It Matters
Divi versionBuilt-in options vary; newer versions may already have a toggle
Child theme in useSafe place for JS/CSS without update risk
Technical comfort levelCode methods need debugging skill
Menu complexityDeep nested menus behave differently than single-level dropdowns
Site traffic typeMobile-heavy audiences make this higher priority
Performance sensitivityPlugin-heavy sites may prefer a CSS/JS approach

What "Correct" Looks Like Depends on the User Experience You're After 🎯

There's no single right answer here. A site where parent pages carry meaningful content — like a "Services" page with an overview — genuinely needs those links accessible. A site where parent items are organizational labels only (no real page behind them) may prefer to keep them non-linking and avoid visitor confusion.

The duplicate child link method is fast and safe, but adds visual clutter. Custom JavaScript gives precision, but requires maintenance. Plugins add capability, but introduce dependencies. Divi's own settings — when available in your version — are the most integrated path, but their presence isn't guaranteed across all installs.

Which approach works cleanly in your specific case depends on your Divi version, whether you're running a child theme, how your menu is structured, and how much technical work is practical for your project.