Fix Unclickable WordPress Submenu on Mobile

When you view your WordPress sites on desktops, sub-menus are usually easily revealed by simply hovering your mouse pointer on the parent menu item. However, when viewed on a mobile device like a smartphone or tablet, tapping on the parent menu item doesn’t reveal the sub-menus but instead redirects you to the parent menu item’s linked url.

The solution is to simply create a null parent menu item, one that doesn’t have a link. You’ll have to add your menu item using the custom Links option as seen below. You won’t be able to click the Add to Menu button without a valid url so you’ll have to temporarily add one which you can remove once the Menu Item is added.

Parent Menu Item Empty
Click Image to Expand.

After clicking on the Add to Menu button, the new item is added on the right side of the page where it is added to the rest of your menu items. You can now delete the URL’s value.

Alternatively, you can input a number sign ( # ) on the URL field instead of a temporary link before clicking the Add to Menu button and you don’t have to delete it later. But an empty URL field is preferable since leaving a number sign ( # ) on the URL field will move the focus to the very top of the page when the menu item is clicked or tapped.

Parent Menu Item Null
Click Image to Expand.

Leave a Reply

Please write your comments in english. I delete anything that even remotely resembles spam.

Note: When posting code, enclose it in pre and code tags.
e.g. <pre><code> Add code here </code></pre>