Accessibility: Add aria-current to the links in the <nav> elements introduced in [44905].

Also fixes a few translators comments and coding standards.

Props audrasjb.
Fixes #47106.


git-svn-id: https://develop.svn.wordpress.org/trunk@45300 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrea Fercia 2019-05-09 20:57:06 +00:00
parent 5b2fb1637c
commit 2ee480e11c
5 changed files with 77 additions and 24 deletions

View File

@ -34,7 +34,7 @@ include( ABSPATH . 'wp-admin/admin-header.php' );
</div>
<nav class="nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
<a href="about.php" class="nav-tab nav-tab-active"><?php _e( 'What&#8217;s New' ); ?></a>
<a href="about.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'What&#8217;s New' ); ?></a>
<a href="credits.php" class="nav-tab"><?php _e( 'Credits' ); ?></a>
<a href="freedoms.php" class="nav-tab"><?php _e( 'Freedoms' ); ?></a>
<a href="freedoms.php?privacy-notice" class="nav-tab"><?php _e( 'Privacy' ); ?></a>

View File

@ -18,15 +18,25 @@ include( ABSPATH . 'wp-admin/admin-header.php' );
?>
<div class="wrap about-wrap full-width-layout">
<h1><?php printf( __( 'Welcome to WordPress %s' ), $display_version ); ?></h1>
<h1>
<?php
/* translators: %s: The current WordPress version number */
printf( __( 'Welcome to WordPress&nbsp;%s' ), $display_version );
?>
</h1>
<p class="about-text"><?php printf( __( 'Congratulations on updating to WordPress 5.2! This update makes it easier than ever to fix your site if something goes wrong.' ), $display_version ); ?></p>
<div class="wp-badge"><?php printf( __( 'Version %s' ), $display_version ); ?></div>
<div class="wp-badge">
<?php
/* translators: %s: The current WordPress version number */
printf( __( 'Version %s' ), $display_version );
?>
</div>
<nav class="nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
<a href="about.php" class="nav-tab"><?php _e( 'What&#8217;s New' ); ?></a>
<a href="credits.php" class="nav-tab nav-tab-active"><?php _e( 'Credits' ); ?></a>
<a href="credits.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'Credits' ); ?></a>
<a href="freedoms.php" class="nav-tab"><?php _e( 'Freedoms' ); ?></a>
<a href="freedoms.php?privacy-notice" class="nav-tab"><?php _e( 'Privacy' ); ?></a>
</nav>
@ -38,8 +48,8 @@ $credits = wp_credits();
if ( ! $credits ) {
echo '<p class="about-description">';
/* translators: 1: https://wordpress.org/about/, 2: https://make.wordpress.org/ */
printf(
/* translators: 1: https://wordpress.org/about/, 2: https://make.wordpress.org/ */
__( 'WordPress is created by a <a href="%1$s">worldwide team</a> of passionate individuals. <a href="%2$s">Get involved in WordPress</a>.' ),
'https://wordpress.org/about/',
__( 'https://make.wordpress.org/' )
@ -123,6 +133,7 @@ return;
// These are strings returned by the API that we want to be translatable
__( 'Project Leaders' );
/* translators: %s: The current WordPress version number */
__( 'Core Contributors to WordPress %s' );
__( 'Noteworthy Contributors' );
__( 'Cofounder, Project Lead' );

View File

@ -18,27 +18,41 @@ include( ABSPATH . 'wp-admin/admin-header.php' );
$is_privacy_notice = isset( $_GET['privacy-notice'] );
if ( $is_privacy_notice ) {
$freedoms_class = '';
$privacy_class = ' nav-tab-active';
$freedoms_class = '';
$privacy_class = ' nav-tab-active';
$freedoms_aria_current = '';
$privacy_aria_current = ' aria-current="page"';
} else {
$freedoms_class = ' nav-tab-active';
$privacy_class = '';
$freedoms_class = ' nav-tab-active';
$privacy_class = '';
$freedoms_aria_current = ' aria-current="page"';
$privacy_aria_current = '';
}
?>
<div class="wrap about-wrap full-width-layout">
<h1><?php printf( __( 'Welcome to WordPress %s' ), $display_version ); ?></h1>
<h1>
<?php
/* translators: %s: The current WordPress version number */
printf( __( 'Welcome to WordPress&nbsp;%s' ), $display_version );
?>
</h1>
<p class="about-text"><?php printf( __( 'Congratulations on updating to WordPress 5.2! This update makes it easier than ever to fix your site if something goes wrong.' ), $display_version ); ?></p>
<div class="wp-badge"><?php printf( __( 'Version %s' ), $display_version ); ?></div>
<div class="wp-badge">
<?php
/* translators: %s: The current WordPress version number */
printf( __( 'Version %s' ), $display_version );
?>
</div>
<nav class="nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
<a href="about.php" class="nav-tab"><?php _e( 'What&#8217;s New' ); ?></a>
<a href="credits.php" class="nav-tab"><?php _e( 'Credits' ); ?></a>
<a href="freedoms.php" class="nav-tab<?php echo $freedoms_class; ?>"><?php _e( 'Freedoms' ); ?></a>
<a href="freedoms.php?privacy-notice" class="nav-tab<?php echo $privacy_class; ?>"><?php _e( 'Privacy' ); ?></a>
<a href="freedoms.php" class="nav-tab<?php echo $freedoms_class; ?>"<?php echo $freedoms_aria_current; ?>><?php _e( 'Freedoms' ); ?></a>
<a href="freedoms.php?privacy-notice" class="nav-tab<?php echo $privacy_class; ?>"<?php echo $privacy_aria_current; ?>><?php _e( 'Privacy' ); ?></a>
</nav>
<?php if ( $is_privacy_notice ) : ?>
@ -46,16 +60,31 @@ if ( $is_privacy_notice ) {
<div class="about-wrap-content">
<p class="about-description"><?php _e( 'From time to time, your WordPress site may send data to WordPress.org &#8212; including, but not limited to &#8212; the version of WordPress you are using, and a list of installed plugins and themes.' ); ?></p>
<p><?php printf( __( 'This data is used to provide general enhancements to WordPress, which includes helping to protect your site by finding and automatically installing new updates. It is also used to calculate statistics, such as those shown on the <a href="%s">WordPress.org stats page</a>.' ), 'https://wordpress.org/about/stats/' ); ?></p>
<p>
<?php
/* translators: %s: https://wordpress.org/about/stats/ */
printf( __( 'This data is used to provide general enhancements to WordPress, which includes helping to protect your site by finding and automatically installing new updates. It is also used to calculate statistics, such as those shown on the <a href="%s">WordPress.org stats page</a>.' ), 'https://wordpress.org/about/stats/' );
?>
</p>
<p><?php printf( __( 'We take privacy and transparency very seriously. To learn more about what data we collect, and how we use it, please visit <a href="%s">WordPress.org/about/privacy</a>.' ), 'https://wordpress.org/about/privacy/' ); ?></p>
<p>
<?php
/* translators: %s: https://wordpress.org/about/privacy/ */
printf( __( 'We take privacy and transparency very seriously. To learn more about what data we collect, and how we use it, please visit <a href="%s">WordPress.org/about/privacy</a>.' ), 'https://wordpress.org/about/privacy/' );
?>
</p>
</div>
<?php else : ?>
<div class="about-wrap-content">
<div class="feature-section has-1-columns">
<h2><?php _e( 'Freedoms' ); ?></h2>
<p class="about-description"><?php printf( __( 'WordPress is Free and open source software, built by a distributed community of mostly volunteer developers from around the world. WordPress comes with some awesome, worldview-changing rights courtesy of its <a href="%s">license</a>, the GPL.' ), 'https://wordpress.org/about/license/' ); ?></p>
<p class="about-description">
<?php
/* translators: %s: https://wordpress.org/about/license/ */
printf( __( 'WordPress is Free and open source software, built by a distributed community of mostly volunteer developers from around the world. WordPress comes with some awesome, worldview-changing rights courtesy of its <a href="%s">license</a>, the GPL.' ), 'https://wordpress.org/about/license/' );
?>
</p>
</div>
<div class="feature-section has-4-columns is-fullwidth">
@ -82,13 +111,18 @@ if ( $is_privacy_notice ) {
</div>
<div class="feature-section has-1-columns">
<p><?php printf( __( 'WordPress grows when people like you tell their friends about it, and the thousands of businesses and services that are built on and around WordPress share that fact with their users. We&#8217;re flattered every time someone spreads the good word, just make sure to <a href="%s">check out our trademark guidelines</a> first.' ), 'https://wordpressfoundation.org/trademark-policy/' ); ?></p>
<p>
<?php
/* translators: %s: https://wordpressfoundation.org/trademark-policy/ */
printf( __( 'WordPress grows when people like you tell their friends about it, and the thousands of businesses and services that are built on and around WordPress share that fact with their users. We&#8217;re flattered every time someone spreads the good word, just make sure to <a href="%s">check out our trademark guidelines</a> first.' ), 'https://wordpressfoundation.org/trademark-policy/' );
?>
</p>
<p>
<?php
$plugins_url = current_user_can( 'activate_plugins' ) ? admin_url( 'plugins.php' ) : __( 'https://wordpress.org/plugins/' );
$themes_url = current_user_can( 'switch_themes' ) ? admin_url( 'themes.php' ) : __( 'https://wordpress.org/themes/' );
/* translators: %s: https://wordpress.org/about/license/ */
printf( __( 'Every plugin and theme in WordPress.org&#8217;s directory is 100%% GPL or a similarly free and compatible license, so you can feel safe finding <a href="%1$s">plugins</a> and <a href="%2$s">themes</a> there. If you get a plugin or theme from another source, make sure to <a href="%3$s">ask them if it&#8217;s GPL</a> first. If they don&#8217;t respect the WordPress license, we don&#8217;t recommend them.' ), $plugins_url, $themes_url, 'https://wordpress.org/about/license/' );
?>
</p>

View File

@ -1118,9 +1118,13 @@ function network_edit_site_nav( $args = array() ) {
// Link classes
$classes = array( 'nav-tab' );
// Aria-current attribute.
$aria_current = '';
// Selected is set by the parent OR assumed by the $pagenow global
if ( $r['selected'] === $link_id || $link['url'] === $GLOBALS['pagenow'] ) {
$classes[] = 'nav-tab-active';
$classes[] = 'nav-tab-active';
$aria_current = ' aria-current="page"';
}
// Escape each class
@ -1130,7 +1134,7 @@ function network_edit_site_nav( $args = array() ) {
$url = add_query_arg( array( 'id' => $r['blog_id'] ), network_admin_url( $link['url'] ) );
// Add link to nav links
$screen_links[ $link_id ] = '<a href="' . esc_url( $url ) . '" id="' . esc_attr( $link_id ) . '" class="' . $esc_classes . '">' . esc_html( $link['label'] ) . '</a>';
$screen_links[ $link_id ] = '<a href="' . esc_url( $url ) . '" id="' . esc_attr( $link_id ) . '" class="' . $esc_classes . '"' . $aria_current . '>' . esc_html( $link['label'] ) . '</a>';
}
// All done!

View File

@ -620,23 +620,27 @@ require_once( ABSPATH . 'wp-admin/admin-header.php' );
endif;
$nav_tab_active_class = '';
$nav_aria_current = '';
if ( ! isset( $_GET['action'] ) || isset( $_GET['action'] ) && 'locations' != $_GET['action'] ) {
$nav_tab_active_class = ' nav-tab-active';
$nav_aria_current = ' aria-current="page"';
}
?>
<hr class="wp-header-end">
<nav class="nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
<a href="<?php echo admin_url( 'nav-menus.php' ); ?>" class="nav-tab<?php echo $nav_tab_active_class; ?>"><?php esc_html_e( 'Edit Menus' ); ?></a>
<a href="<?php echo admin_url( 'nav-menus.php' ); ?>" class="nav-tab<?php echo $nav_tab_active_class; ?>"<?php echo $nav_aria_current; ?>><?php esc_html_e( 'Edit Menus' ); ?></a>
<?php
if ( $num_locations && $menu_count ) {
$active_tab_class = '';
$aria_current = '';
if ( $locations_screen ) {
$active_tab_class = ' nav-tab-active';
$aria_current = ' aria-current="page"';
}
?>
<a href="<?php echo esc_url( add_query_arg( array( 'action' => 'locations' ), admin_url( 'nav-menus.php' ) ) ); ?>" class="nav-tab<?php echo $active_tab_class; ?>"><?php esc_html_e( 'Manage Locations' ); ?></a>
<a href="<?php echo esc_url( add_query_arg( array( 'action' => 'locations' ), admin_url( 'nav-menus.php' ) ) ); ?>" class="nav-tab<?php echo $active_tab_class; ?>"<?php echo $aria_current; ?>><?php esc_html_e( 'Manage Locations' ); ?></a>
<?php
}
?>
@ -878,7 +882,7 @@ require_once( ABSPATH . 'wp-admin/admin-header.php' );
$menu_name_val = 'value="' . esc_attr( $nav_menu_selected_title ) . '"';
}
?>
<input type="hidden" name="action" value="update" />
<input type="hidden" name="action" value="update" />
<input type="hidden" name="menu" id="menu" value="<?php echo esc_attr( $nav_menu_selected_id ); ?>" />
<div id="nav-menu-header">
<div class="major-publishing-actions wp-clearfix">
@ -956,8 +960,8 @@ require_once( ABSPATH . 'wp-admin/admin-header.php' );
<?php if ( ! empty( $menu_locations[ $location ] ) && $menu_locations[ $location ] != $nav_menu_selected_id ) : ?>
<span class="theme-location-set">
<?php
/* translators: %s: menu name */
printf(
/* translators: %s: menu name */
_x( '(Currently set to: %s)', 'menu location' ),
wp_get_nav_menu_object( $menu_locations[ $location ] )->name
);