Advanced Custom Fields: Nav Menu Field Plugin

Add Navigation Menus to Advanced Custom Fields (ACF) with the Nav Menu Field plugin! This plugin adds the Nav Menu Field type to ACF (version 5 & 4), allowing you to select from the menus you create in the WordPress Admin backend to use on your website’s frontend.

Using ACF, you can set the Nav Menu Field to return the selected menu’s:

• ID for lightweight coding,
• Object for more involved programming, or
• HTML (generated from wp_nav_menu) for quickly displaying a menu.

I created this plugin because I needed to display a secondary menu that changed depending on what page you’re on. Most of those pages were children of the same page, but then I had to throw a couple of Custom Post Types in there too. Because of the Custom Post Types, I couldn’t just grab the top most parent for the current page and use wp_list_pages. So I did some research and decided to extend the functionality of my favourite plugin, Advanced Custom Fields. Now when I create a new Page or Custom Post, I just select the menu from a drop down menu!

Feel free to try this add-on on your dev site, ask questions on the support link above, and please review this add-on. By leaving a rating and review, you help this plugin become even better!

Advanced Custom Fields Compatibility

This add-on will work with:

• version 5
• version 4

Follow the following instructions: https://codex.wordpress.org/Managing_Plugins#Installing_Plugins

1. 

   Adding the Nav Menu Field to an Advanced Custom Fields Field Group

2. 

   Creating your menu in the WordPress Admin backend

3. 

   Selecting the previously created menu in the meta box created by Advanced Custom Fields

4. 

   Viewing the (not styled) menu displayed by calling 'the_field()' in the sidebar

Installation Instructions

Follow the following instructions: https://codex.wordpress.org/Managing_Plugins#Installing_Plugins

Can you show a quick example of how to use this?

Sure can!

1. Create a new field group
2. Add a Nav Menu and set the Field Label to Side Menu (this will cause the Field Name to be side_menu)
3. Set the Nav Menu’s Return Value to Nav Menu HTML
4. Set the Location Rules to Show if “Post Type” “is equal to” “Page”
5. Save the Field Group

6. Now in your themes sidebar.php, put the following code before or after any of the div’s with class=”widget-area”

Finally, create or edit a page, select a menu in the Side Menu field, and view the page to see that menu in the sidebar!

Will you make this plugin compatible with Advanced Custom Fields v3?

No.

Why does the Nav Menu returned by your plugin look like an unstyled list of links?

So that you can style it yourself. I don’t want to step on your toes 🙂

I added the Nav Menu Field to Pages, selected my menu when creating a new page, but the menu doesn’t show. What gives?

First, check that you added the necessary ACF code to your templates. If you don’t know what I’m talking about, read up on how to use Advanced Custom Fields. If you’re already familiar with ACF and you still can’t figure out why the menu isn’t showing up, start a new support thread, include details and a little code, and I’ll do my best to help you.

2.0.0

• Added ACF v5 class.
• Updated code to follow coding standards
• Updated the ACF v4 class to use the updated code found in the ACF v5 Class

1.1.2

• Fixed a silly mistake related to allowing Null for a Nav Menu Field. Basically, it was storing the string “null” when you don’t select a menu, that’s taken care of now.

1.1.1

• I forgot to add a default value for the Menu Container field, so I added ‘div’ as the default value. If you upgraded from 1.0.0 to 1.1.0 and had WP_DEBUG enabled, you would receive a warning about an unknown index. Since I like debug mode to run without warnings, I fixed this.

1.1.0

• Added a field which allows users to choose the containing element for the Menu’s ul. See wp_nav_menu’s container parameter

1.0.0

• Initial Release.