Skip to content

Commit

Permalink
Administration: A11y: Clarify settings in discussion options.
Browse files Browse the repository at this point in the history 
Fix several settings groups in the discussion options that were written in a compound/sentence structure format. These formats are difficult to parse for screen reader users and have significant layout problems in mobile viewports.

Change settings to use independent labeling.

Props Cheffheid, anthakkar08, DrewAPicture, afercia, jwgoedert, sannevndrmeulen, sudipatel007, tirth03, joedolson.
See #31354.

git-svn-id: https://develop.svn.wordpress.org/trunk@59160 602fd350-edb4-49c9-b593-d223f7449a82
  • Loading branch information
@joedolson
joedolson committed Oct 3, 2024
1 parent 03834fe commit b077dc5
Show file tree
Hide file tree
Showing 2 changed files with 51 additions and 64 deletions.
2 changes: 1 addition & 1 deletion src/wp-admin/css/edit.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1297,7 +1297,7 @@ div.tabs-panel-active:focus {
/* Only visible in Windows High Contrast mode */
outline: 2px solid transparent;
}

.options-discussion-php .indent-children ul,
#front-page-warning,
#front-static-pages ul,
ul.export-filters,
Expand Down
113 changes: 50 additions & 63 deletions src/wp-admin/options-discussion.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
<form method="post" action="options.php">
<?php settings_fields( 'discussion' ); ?>

<table class="form-table" role="presentation">
<table class="form-table indent-children" role="presentation">
<tr>
<th scope="row"><?php _e( 'Default post settings' ); ?></th>
<td><fieldset><legend class="screen-reader-text"><span>
Expand Down Expand Up @@ -86,27 +86,20 @@
?>
</label>
<br />
<input name="close_comments_for_old_posts" type="checkbox" id="close_comments_for_old_posts" value="1" <?php checked( '1', get_option( 'close_comments_for_old_posts' ) ); ?> /> <label for="close_comments_for_old_posts"><?php _e( 'Automatically close comments on old posts' ); ?></label>
<ul>
<li>
<label for="close_comments_days_old"><?php _e( 'Close comments when post is how many days old' ); ?></label>
<input name="close_comments_days_old" type="number" step="1" min="0" id="close_comments_days_old" value="<?php echo esc_attr( get_option( 'close_comments_days_old' ) ); ?>" class="small-text"/>
</li>
</ul>

<label for="close_comments_for_old_posts">
<input name="close_comments_for_old_posts" type="checkbox" id="close_comments_for_old_posts" value="1" <?php checked( '1', get_option( 'close_comments_for_old_posts' ) ); ?> />
<?php
printf(
/* translators: %s: Number of days. */
__( 'Automatically close comments on posts older than %s days' ),
'</label> <label for="close_comments_days_old"><input name="close_comments_days_old" type="number" min="0" step="1" id="close_comments_days_old" value="' . esc_attr( get_option( 'close_comments_days_old' ) ) . '" class="small-text" />'
);
?>
</label>
<br />

<label for="show_comments_cookies_opt_in">
<input name="show_comments_cookies_opt_in" type="checkbox" id="show_comments_cookies_opt_in" value="1" <?php checked( '1', get_option( 'show_comments_cookies_opt_in' ) ); ?> />
<?php _e( 'Show comments cookies opt-in checkbox, allowing comment author cookies to be set' ); ?>
</label>
<label for="show_comments_cookies_opt_in"><?php _e( 'Show comments cookies opt-in checkbox, allowing comment author cookies to be set' ); ?></label>
<br />

<label for="thread_comments">
<input name="thread_comments" type="checkbox" id="thread_comments" value="1" <?php checked( '1', get_option( 'thread_comments' ) ); ?> />
<label for="thread_comments"><?php _e( 'Enable threaded (nested) comments' ); ?></label>

<?php
/**
* Filters the maximum depth of threaded/nested comments.
Expand All @@ -117,7 +110,7 @@
*/
$maxdeep = (int) apply_filters( 'thread_comments_depth_max', 10 );

$thread_comments_depth = '</label> <label for="thread_comments_depth"><select name="thread_comments_depth" id="thread_comments_depth">';
$thread_comments_depth = '<select name="thread_comments_depth" id="thread_comments_depth">';
for ( $i = 2; $i <= $maxdeep; $i++ ) {
$thread_comments_depth .= "<option value='" . esc_attr( $i ) . "'";
if ( (int) get_option( 'thread_comments_depth' ) === $i ) {
Expand All @@ -126,52 +119,46 @@
$thread_comments_depth .= ">$i</option>";
}
$thread_comments_depth .= '</select>';

/* translators: %s: Number of levels. */
printf( __( 'Enable threaded (nested) comments %s levels deep' ), $thread_comments_depth );

?>
</label>
<br />
<label for="page_comments">
<input name="page_comments" type="checkbox" id="page_comments" value="1" <?php checked( '1', get_option( 'page_comments' ) ); ?> />
<?php
$default_comments_page = '</label> <label for="default_comments_page"><select name="default_comments_page" id="default_comments_page"><option value="newest"';
if ( 'newest' === get_option( 'default_comments_page' ) ) {
$default_comments_page .= ' selected="selected"';
}
$default_comments_page .= '>' . __( 'last' ) . '</option><option value="oldest"';
if ( 'oldest' === get_option( 'default_comments_page' ) ) {
$default_comments_page .= ' selected="selected"';
}
$default_comments_page .= '>' . __( 'first' ) . '</option></select>';
printf(
/* translators: 1: Form field control for number of top level comments per page, 2: Form field control for the 'first' or 'last' page. */
__( 'Break comments into pages with %1$s top level comments per page and the %2$s page displayed by default' ),
'</label> <label for="comments_per_page"><input name="comments_per_page" type="number" step="1" min="0" id="comments_per_page" value="' . esc_attr( get_option( 'comments_per_page' ) ) . '" class="small-text" />',
$default_comments_page
);
?>
</label>
<br />
<label for="comment_order">
<?php

$comment_order = '<select name="comment_order" id="comment_order"><option value="asc"';
if ( 'asc' === get_option( 'comment_order' ) ) {
$comment_order .= ' selected="selected"';
}
$comment_order .= '>' . __( 'older' ) . '</option><option value="desc"';
if ( 'desc' === get_option( 'comment_order' ) ) {
$comment_order .= ' selected="selected"';
}
$comment_order .= '>' . __( 'newer' ) . '</option></select>';

/* translators: %s: Form field control for 'older' or 'newer' comments. */
printf( __( 'Comments should be displayed with the %s comments at the top of each page' ), $comment_order );
<ul>
<li>
<label for="thread_comments_depth"><?php _e( 'Number of levels for threaded (nested) comments' ); ?></label>
<?php echo $thread_comments_depth; ?>
</li>
</ul>
</fieldset></td>
</tr>

?>
</label>
<tr>
<th scope="row"><?php _e( 'Comment Pagination' ); ?></th>
<td><fieldset><legend class="screen-reader-text"><span>
<?php
/* translators: Hidden accessibility text. */
_e( 'Comment Pagination' );
?>
</span></legend>
<input name="page_comments" type="checkbox" id="page_comments" value="1" <?php checked( '1', get_option( 'page_comments' ) ); ?> />
<label for="page_comments"><?php _e( 'Break comments into pages' ); ?></label>
<ul>
<li>
<label for="comments_per_page"><?php _e( 'Top level comments per page' ); ?></label>
<input name="comments_per_page" type="number" step="1" min="0" id="comments_per_page" value="<?php echo esc_attr( get_option( 'comments_per_page' ) ); ?>" class="small-text" />
</li>
<li>
<label for="default_comments_page"><?php _e( 'Comments page to display by default' ); ?></label>
<select name="default_comments_page" id="default_comments_page">
<option value="newest" <?php selected( 'newest', get_option( 'default_comments_page' ) ); ?>><?php _e( 'last page' ); ?></option>
<option value="oldest" <?php selected( 'oldest', get_option( 'default_comments_page' ) ); ?>><?php _e( 'first page' ); ?></option>
</select>
</li>
<li>
<label for="comment_order"><?php _e( 'Comments to display at the top of each page' ); ?></label>
<select name="comment_order" id="comment_order">
<option value="asc" <?php selected( 'asc', get_option( 'comment_order' ) ); ?>><?php _e( 'older' ); ?></option>
<option value="desc" <?php selected( 'desc', get_option( 'comment_order' ) ); ?>><?php _e( 'newer' ); ?></option>
</select>
</li>
</ul>
</fieldset></td>
</tr>
<tr>
Expand Down

0 comments on commit b077dc5

Please sign in to comment.