How To Use Conditions In A WordPress Navigation Menu

Setting visibility conditions for website menu links can improve a sites overall user experience.

I’m redesigning a nonprofit website for the Judicial Friends Association (JFA) and I use visibility conditions to show/hide navigation menu links to add context and provide a better user experience.

I’m going to break this down…

Menu Requirements

Here are the functional requirements for the JFA website Main Menu:

• Make it easy for new members to register.
• Make it easy for members to renew their Membership each year.
• Make it easy for members to access and manage their Membership account.
• Make it easy for site visitors to access site content.

It helps to list the requirements of your website menu.

The Site Map

Here is the Site Map showing the sites’ main navigation structure:

1.0 Logo – Links to the site Home page.
2.0 Highlights – Blog posts.
3.0 About
– 3.1 President’s Message
– 3.2 Board Of Directors
– 3.3 About Us
– 3.4 Our History
– 3.5 Scholarships
– 3.6 Internships
4.0 Membership (Show/Hide Condition)
5.0 My Account (Show/Hide Condition)
6.0 Login (Show/Hide Condition)
7.0 Logout (Show/Hide Condition)

How It Works

Here’s a breakdown of how this works.

I set visibility Conditions for 4 of the menu items as follows:

Membership | Condition: Visible to Logged-Out users.

My Account | Condition: Visible to Logged-In users.

Login | Condition: Visible to Logged-Out users.

Logout | Condition: Visible to Logged-In users.

The result is users see what they need to see based upon their logged-in status.

There are many use cases for using visibility conditions in a WordPress navigation menu. Here are a few examples:

• Show a link IF a users role is Customer.
• Show a link IF the day of the week is Friday.
• Show a link IF a users registration date is Before/After a specific date.

Try adding visibility conditions to your website menu and see how it improves your site.

Cheers!