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

Timestamp:

07/06/2020 08:42:14 PM (4 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-widget-meta.php (modified) (3 diffs)

trunk/src/wp-includes/widgets/class-wp-widget-meta.php

@@ -43 +43 @@
      */
     public function widget( $args, $instance ) {
-        $title = ! empty( $instance['title'] ) ? $instance['title'] : __( 'Meta' );
+        $default_title = __( 'Meta' );
+        $title         = ! empty( $instance['title'] ) ? $instance['title'] : $default_title;
 
         /** This filter is documented in wp-includes/widgets/class-wp-widget-pages.php */
@@ -53 +54 @@
             echo $args['before_title'] . $title . $args['after_title'];
         }
+
+        $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;
+            echo '<nav role="navigation" aria-label="' . esc_attr( $aria_label ) . '">';
+        }
         ?>
-            <ul>
+
+
+        <ul>
             <?php wp_register(); ?>
             <li><?php wp_loginout(); ?></li>
             <li><a href="<?php echo esc_url( get_bloginfo( 'rss2_url' ) ); ?>"><?php _e( 'Entries feed' ); ?></a></li>
             <li><a href="<?php echo esc_url( get_bloginfo( 'comments_rss2_url' ) ); ?>"><?php _e( 'Comments feed' ); ?></a></li>
+
             <?php
             /**
@@ -81 +104 @@
             wp_meta();
             ?>
-            </ul>
-            <?php
 
-            echo $args['after_widget'];
+        </ul>
+
+        <?php if ( 'html5' === $format ) : ?>
+            </nav>
+        <?php endif; ?>
+
+        <?php
+        echo $args['after_widget'];
     }