Accessibility: Make the Widgets screen "Enable accessibility mode" link more discoverable.

For a number of years, the link to the Widgets screen "Accessibility mode" lived
in the Screen Options panel, hidden by default. Many users, including assistive
technologies users, weren't able to find it or even aware it existed. By bringing
the link in the main screen, visible by default, this change makes the
"Accessibility mode" easily discoverable for everyone.

Props chetan200891, antonioeatgoat.
Fixes #42778.


git-svn-id: https://develop.svn.wordpress.org/trunk@42790 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrea Fercia 2018-03-06 17:20:07 +00:00
parent cdcce1b9c6
commit 1a03159d26
3 changed files with 22 additions and 14 deletions

View File

@ -495,6 +495,11 @@ div#widgets-right .closed .widgets-sortables {
}
/* Accessibility Mode */
.widget-access-link {
float: right;
margin: -5px 0 10px 10px;
}
.widgets_access #widgets-left .widget .widget-top {
cursor: auto;
}
@ -793,6 +798,11 @@ ul.CodeMirror-hints {
margin: 0 auto !important;
max-width: 480px;
}
.widget-access-link {
float: none;
margin: 15px 0 0 0;
}
}
@media screen and (max-width: 320px) {

View File

@ -918,20 +918,13 @@ if ( $this->show_screen_options() ) :
$show_screen = ! empty( $wp_meta_boxes[ $this->id ] ) || $columns || $this->get_option( 'per_page' );
switch ( $this->base ) {
case 'widgets':
$nonce = wp_create_nonce( 'widgets-access' );
$this->_screen_settings = '<p><a id="access-on" href="widgets.php?widgets-access=on&_wpnonce=' . urlencode( $nonce ) . '">' . __( 'Enable accessibility mode' ) . '</a><a id="access-off" href="widgets.php?widgets-access=off&_wpnonce=' . urlencode( $nonce ) . '">' . __( 'Disable accessibility mode' ) . "</a></p>\n";
break;
case 'post':
$expand = '<fieldset class="editor-expand hidden"><legend>' . __( 'Additional settings' ) . '</legend><label for="editor-expand-toggle">';
$expand .= '<input type="checkbox" id="editor-expand-toggle"' . checked( get_user_setting( 'editor_expand', 'on' ), 'on', false ) . ' />';
$expand .= __( 'Enable full-height editor and distraction-free functionality.' ) . '</label></fieldset>';
$this->_screen_settings = $expand;
break;
default:
$this->_screen_settings = '';
break;
$this->_screen_settings = '';
if ( 'post' === $this->base ) {
$expand = '<fieldset class="editor-expand hidden"><legend>' . __( 'Additional settings' ) . '</legend><label for="editor-expand-toggle">';
$expand .= '<input type="checkbox" id="editor-expand-toggle"' . checked( get_user_setting( 'editor_expand', 'on' ), 'on', false ) . ' />';
$expand .= __( 'Enable full-height editor and distraction-free functionality.' ) . '</label></fieldset>';
$this->_screen_settings = $expand;
}
/**

View File

@ -399,7 +399,12 @@ if ( current_user_can( 'customize' ) ) {
__( 'Manage with Live Preview' )
);
}
$nonce = wp_create_nonce( 'widgets-access' );
?>
<div class="widget-access-link">
<a id="access-on" href="widgets.php?widgets-access=on&_wpnonce=<?php echo urlencode( $nonce ); ?>"><?php _e( 'Enable accessibility mode' ); ?></a><a id="access-off" href="widgets.php?widgets-access=off&_wpnonce=<?php echo urlencode( $nonce ); ?>"><?php _e( 'Disable accessibility mode' ); ?></a>
</div>
<hr class="wp-header-end">