How to Create WordPress Menu Items Without a Link

WordPress is a platform suitable for everyone, including people with absolutely zero coding knowledge. Pair this CMS with the right WordPress theme and you can create almost any website imaginable.

Whatever the niche, there are some elements that all websites have in common. For example, every website should have a good navigation menu to enable users to find their way easily. And if you run a multi-tiered website with a lot of content then you need to create a mega menu to ensure effective user navigation. A well-structured menu is an absolute must as it allows users to quickly find and access sections of a website they are interested in..

When adding menu items to your menu in WordPress, by default each item must have a link and take the user somewhere with a click. Of course, there are situations when the connection is not necessary, it is unnecessary.

For example, we might want to display a menu item that will simply open the sub-items in the dropdown and not actually link to anything. These items are called “unlinked” or “dead” menu items, and unlike “regular” menu items, they are not clickable.

It’s time to learn how to create WordPress menu items without a link.

Creating a Menu Item Without a Connection

In your admin dashboard, navigate to: View > Menus.

Under Add menu itemsclick Private Links. If you don’t see this option, scroll to the top of the page and in the top right corner Display Options.

Click on it, search Private Linksand tick this box.

let’s go now Private Links. This option Add menu items Episode. Inside URL enter a hashtag in the field (#). Inside link text field, enter the name of the menu item you are about to create.

When you’re done, press the button. Add to Menu button. After saving the changes, the new menu item will appear in the menu structure on the right.

You can now click the menu item to open its options. If you leave the ‘#’ sign in the URL field, the new menu item will appear to be linked, but clicking it will take users back to the top of the page they’re currently browsing. If you delete the hashtag and leave the field blank, the page they’re browsing will refresh when they click on the menu item.

Fortunately, there is a simple solution to this too.

Making Menu Items Unclickable

To make it clear that a menu item is unlinked, you can have the mouse cursor displayed as the default icon when a user hovers over that menu item. If you are using one of Qode Interactive’s premium WordPress themes, you can do this by checking the following. connecting Box.

This will not only show the default cursor on hover, but will also make the menu item unclickable (i.e. nothing will happen if a user clicks on the menu item).

If you’re not using one of our themes, you can keep the default cursor on hover and make the link unclickable via simple CSS. Inside View > Menus click Display Options make sure the top of the page and CSS Classes box is checked.

Next, go to the menu item you unlinked earlier and CSS Classes choice. Write not clickable click this field and then Save Menu.

Now that you have created the class, add the following code to your CSS:

.unclickable > a {
pointer-events: none;
}

And that’s all. Users will no longer be able to click on any menu item with a non-clickable class.

…and It’s a Wrap!

We’ve come to the end of our tutorial on how to create WordPress menu items without a link, and we’ve also shown you how to make your mouse pointer disappear. When making changes to your admin dashboard and CSS, save any changes you make along the way. And remember, clear navigation is a crucial component of good UX. Your visitors should be able to move from one page to another seamlessly, so plan your menu structure well, but don’t be afraid to experiment with the menu’s look. Explore the possibilities of hidden menus or full-screen navigation, but always make sure your website is clear and easy to use.