David A. Kennedy 3:38 pm on December 1, 2015
Tags:   

Menu ids in wp_page_menu()

In changeset 34330, we added a menu_id argument to wp_page_menu(), allowing theme authors to use a unique id with the containing menu div.

It also means that, by default, the fallback menus have the same attributes as wp_nav_menu(). So wp_page_menu() and wp_nav_menu() now have the same menu_id. We made this change to help accommodate accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) and certain ARIA attributes that require an id to be associated with a control. Before this change, theme authors lacked an easy way to add an id to that container.

This shouldn’t cause most themes to break, except in a few edge cases. If you rely on the absence of that id in your theme for wp_page_menu() or do any kind of detection around wp_page_menu() vs. wp_nav_menu(), read on. I’ll go over a few recommended ways you can avoid your theme breaking with the release of WordPress 4.4.

If you need to add class names or id names to the HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. output of either function, you can use a filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. for that. Like this, using Twenty Fourteen as an example:


function twentyfourteen_page_menu_args( $args ) {
    $args['menu_id'] = 'page-menu';
    return $args;
}
add_filter( 'wp_page_menu_args', 'twentyfourteen_page_menu_args' );

If you need to do something similar with wp_nav_menu(), you can either change the id with an argument in the template tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.) itself, or use a filer, similar to the page menu. Again, using Twenty Fourteen as an example:


function twentyfourteen_nav_menu_args( $args ) {
    $args['menu_id'] = 'nav-menu';
    return $args;
}
add_filter( 'wp_nav_menu_args', 'twentyfourteen_nav_menu_args' );

Note that wp_nav_menu() adds the id to the ul element and wp_page_menu() adds it to the container element around the ul. So your CSSCSS Cascading Style Sheets. may need adjusting depending on what you have in place. You may need to make it less specific in some cases.

#themes