Changeset 48349 for trunk/src/wp-includes/widgets/class-wp-nav-menu-widget.php

Timestamp:

07/06/2020 08:42:14 PM (6 years ago)

Author:

afercia

Message:

Accessibility: Widgets: Add theme support to make widgets output list of links wrapped within a <nav> element.

Widgets that output list of links can now be wrapped within <nav> elements to improve semantics and accessibility.

The <nav> elements are also native landmark regions, which helps assistive technology users to navigate through them. Themes can opt-in to this new behavior by declaring support for the new html5 feature navigation-widgets.

Props joedolson, simonjanin, audrasjb, afercia.
Fixes #48170.

File:

• trunk/src/wp-includes/widgets/class-wp-nav-menu-widget.php (modified) (2 diffs)

trunk/src/wp-includes/widgets/class-wp-nav-menu-widget.php

@@ -47 +47 @@
                 }
 
-                $title = ! empty( $instance['title'] ) ? $instance['title'] : '';
+                $default_title = __( 'Menu' );
+                $title         = ! empty( $instance['title'] ) ? $instance['title'] : '';
 
                 /** This filter is documented in wp-includes/widgets/class-wp-widget-pages.php */
@@ -58 +59 @@
                 }
 
-                $nav_menu_args = array(
-                        'fallback_cb' => '',
-                        'menu'        => $nav_menu,
-                );
+                $format = current_theme_supports( 'html5', 'navigation-widgets' ) ? 'html5' : 'xhtml';
+
+                /**
+                 * Filters the HTML format of widgets with navigation links.
+                 *
+                 * @since 5.5.0
+                 *
+                 * @param string $format The type of markup to use in widgets with navigation links.
+                 *                       Accepts 'html5', 'xhtml'.
+                 */
+                $format = apply_filters( 'navigation_widgets_format', $format );
+
+                if ( 'html5' === $format ) {
+                        // The title may be filtered: Strip out HTML and make sure the aria-label is never empty.
+                        $title      = trim( strip_tags( $title ) );
+                        $aria_label = $title ? $title : $default_title;
+
+                        $nav_menu_args = array(
+                                'fallback_cb'          => '',
+                                'menu'                 => $nav_menu,
+                                'container'            => 'nav',
+                                'container_aria_label' => $aria_label,
+                                'items_wrap'           => '<ul id="%1$s" class="%2$s">%3$s</ul>',
+                        );
+                } else {
+                        $nav_menu_args = array(
+                                'fallback_cb' => '',
+                                'menu'        => $nav_menu,
+                        );
+                }
 
                 /**