Basic Setup
To get started with the Nav Menu Field in SCF, follow these steps to configure and display a WordPress navigation menu:
Step 1: Create a New Field Group
First, create a new field group in Secure Custom Fields (SCF). This field group will hold your custom fields, including the Nav Menu field.
- Go to Custom Fields > Add New in your WordPress admin panel.
- Title your field group and choose the location rules for where this field group should be displayed (e.g., on a specific page or post type).
Step 2: Add a Nav Menu Field
Once you’ve created a new field group, add a new field of type Nav Menu. This field will allow users to select a navigation menu from the available menus on your site.
- Click Add Field within the field group.
- Set the Field Type to Nav Menu.
- Configure the necessary field options based on your needs.
Step 3: Configure Options
Configure the field options for the Nav Menu field to tailor it to your needs.
- Return Value: Choose how you want the selected menu to be returned:
- Menu ID: The ID of the selected menu.
- Nav Menu HTML: The raw HTML of the selected menu.
- Nav Menu Object: The complete menu object, including properties like the menu name and term ID.
- Menu Container: This option determines the wrapper tag for the menu when the Nav Menu HTML return format is selected. Common options include
div,nav, ornone. You can also add additional container tags using thewp_nav_menu_container_allowed_tagsfilter. -
Allow Null: Set this option to true or false to allow or disallow a null value (i.e., no menu selected). When true, an empty option will be available for the user to select.
Code Example: Basic Setup
Here’s how you can implement the Nav Menu Field in a template file:
// Check if the Nav Menu Field has a value
$menu_id = get_field('your_nav_menu_field_name');
if ($menu_id) {
// Get the menu object or HTML based on your configuration
$menu_html = wp_nav_menu(array(
'menu' => $menu_id, // Use the menu ID
'container' => 'nav', // Use a 'nav' container
'echo' => false, // Don't output directly; return the HTML
));
echo $menu_html; // Output the menu HTML
}
Common Use Cases
- Use to Output WordPress Navigation Menu Anywhere:
The Nav Menu Field allows you to output a WordPress navigation menu in custom locations across your site, such as in custom templates, widgets, or shortcodes.
Tips
- To Add More Menu Containers:
Use thewp_nav_menu_container_allowed_tagshook to add additional allowed container tags for the Nav Menu field. This will enable more flexibility in the menu’s wrapper tag.Example:
“`php
function my_custom_menu_container_tags($tags) {
$tags[] = ‘section’; // Adds ‘section’ as an allowed container tag
return $tags;
}
add_filter(‘wp_nav_menu_container_allowed_tags’, ‘my_custom_menu_container_tags’);