Make WordPress Core

Changeset 59160


Ignore:
Timestamp:
10/03/2024 09:26:57 PM (2 months ago)
Author:
joedolson
Message:

Administration: A11y: Clarify settings in discussion options.

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.

Location:
trunk/src/wp-admin
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/css/edit.css

    r58747 r59160  
    12981298    outline: 2px solid transparent;
    12991299}
    1300 
     1300.options-discussion-php .indent-children ul,
    13011301#front-page-warning,
    13021302#front-static-pages ul,
  • trunk/src/wp-admin/options-discussion.php

    r55412 r59160  
    4343<?php settings_fields( 'discussion' ); ?>
    4444
    45 <table class="form-table" role="presentation">
     45<table class="form-table indent-children" role="presentation">
    4646<tr>
    4747<th scope="row"><?php _e( 'Default post settings' ); ?></th>
     
    8787</label>
    8888<br />
    89 
    90 <label for="close_comments_for_old_posts">
    91 <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' ) ); ?> />
    92 <?php
    93 printf(
    94     /* translators: %s: Number of days. */
    95     __( 'Automatically close comments on posts older than %s days' ),
    96     '</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" />'
    97 );
    98 ?>
    99 </label>
    100 <br />
    101 
    102 <label for="show_comments_cookies_opt_in">
     89<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>
     90<ul>
     91    <li>
     92        <label for="close_comments_days_old"><?php _e( 'Close comments when post is how many days old' ); ?></label>
     93        <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"/>
     94    </li>
     95</ul>
     96
    10397<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' ) ); ?> />
    104 <?php _e( 'Show comments cookies opt-in checkbox, allowing comment author cookies to be set' ); ?>
    105 </label>
    106 <br />
    107 
    108 <label for="thread_comments">
     98<label for="show_comments_cookies_opt_in"><?php _e( 'Show comments cookies opt-in checkbox, allowing comment author cookies to be set' ); ?></label>
     99<br />
    109100<input name="thread_comments" type="checkbox" id="thread_comments" value="1" <?php checked( '1', get_option( 'thread_comments' ) ); ?> />
     101<label for="thread_comments"><?php _e( 'Enable threaded (nested) comments' ); ?></label>
     102
    110103<?php
    111104/**
     
    118111$maxdeep = (int) apply_filters( 'thread_comments_depth_max', 10 );
    119112
    120 $thread_comments_depth = '</label> <label for="thread_comments_depth"><select name="thread_comments_depth" id="thread_comments_depth">';
     113$thread_comments_depth = '<select name="thread_comments_depth" id="thread_comments_depth">';
    121114for ( $i = 2; $i <= $maxdeep; $i++ ) {
    122115    $thread_comments_depth .= "<option value='" . esc_attr( $i ) . "'";
     
    127120}
    128121$thread_comments_depth .= '</select>';
    129 
    130 /* translators: %s: Number of levels. */
    131 printf( __( 'Enable threaded (nested) comments %s levels deep' ), $thread_comments_depth );
    132 
    133 ?>
    134 </label>
    135 <br />
    136 <label for="page_comments">
     122?>
     123<ul>
     124    <li>
     125        <label for="thread_comments_depth"><?php _e( 'Number of levels for threaded (nested) comments' ); ?></label>
     126        <?php echo $thread_comments_depth; ?>
     127    </li>
     128</ul>
     129</fieldset></td>
     130</tr>
     131
     132<tr>
     133<th scope="row"><?php _e( 'Comment Pagination' ); ?></th>
     134<td><fieldset><legend class="screen-reader-text"><span>
     135    <?php
     136    /* translators: Hidden accessibility text. */
     137    _e( 'Comment Pagination' );
     138    ?>
     139</span></legend>
    137140<input name="page_comments" type="checkbox" id="page_comments" value="1" <?php checked( '1', get_option( 'page_comments' ) ); ?> />
    138 <?php
    139 $default_comments_page = '</label> <label for="default_comments_page"><select name="default_comments_page" id="default_comments_page"><option value="newest"';
    140 if ( 'newest' === get_option( 'default_comments_page' ) ) {
    141     $default_comments_page .= ' selected="selected"';
    142 }
    143 $default_comments_page .= '>' . __( 'last' ) . '</option><option value="oldest"';
    144 if ( 'oldest' === get_option( 'default_comments_page' ) ) {
    145     $default_comments_page .= ' selected="selected"';
    146 }
    147 $default_comments_page .= '>' . __( 'first' ) . '</option></select>';
    148 printf(
    149     /* translators: 1: Form field control for number of top level comments per page, 2: Form field control for the 'first' or 'last' page. */
    150     __( 'Break comments into pages with %1$s top level comments per page and the %2$s page displayed by default' ),
    151     '</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" />',
    152     $default_comments_page
    153 );
    154 ?>
    155 </label>
    156 <br />
    157 <label for="comment_order">
    158 <?php
    159 
    160 $comment_order = '<select name="comment_order" id="comment_order"><option value="asc"';
    161 if ( 'asc' === get_option( 'comment_order' ) ) {
    162     $comment_order .= ' selected="selected"';
    163 }
    164 $comment_order .= '>' . __( 'older' ) . '</option><option value="desc"';
    165 if ( 'desc' === get_option( 'comment_order' ) ) {
    166     $comment_order .= ' selected="selected"';
    167 }
    168 $comment_order .= '>' . __( 'newer' ) . '</option></select>';
    169 
    170 /* translators: %s: Form field control for 'older' or 'newer' comments. */
    171 printf( __( 'Comments should be displayed with the %s comments at the top of each page' ), $comment_order );
    172 
    173 ?>
    174 </label>
     141<label for="page_comments"><?php _e( 'Break comments into pages' ); ?></label>
     142<ul>
     143    <li>
     144        <label for="comments_per_page"><?php _e( 'Top level comments per page' ); ?></label>
     145        <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" />
     146    </li>
     147    <li>
     148        <label for="default_comments_page"><?php _e( 'Comments page to display by default' ); ?></label>
     149        <select name="default_comments_page" id="default_comments_page">
     150            <option value="newest" <?php selected( 'newest', get_option( 'default_comments_page' ) ); ?>><?php _e( 'last page' ); ?></option>
     151            <option value="oldest" <?php selected( 'oldest', get_option( 'default_comments_page' ) ); ?>><?php _e( 'first page' ); ?></option>
     152        </select>
     153    </li>
     154    <li>
     155        <label for="comment_order"><?php _e( 'Comments to display at the top of each page' ); ?></label>
     156        <select name="comment_order" id="comment_order">
     157            <option value="asc" <?php selected( 'asc', get_option( 'comment_order' ) ); ?>><?php _e( 'older' ); ?></option>
     158            <option value="desc" <?php selected( 'desc', get_option( 'comment_order' ) ); ?>><?php _e( 'newer' ); ?></option>
     159        </select>
     160    </li>
     161</ul>
    175162</fieldset></td>
    176163</tr>
Note: See TracChangeset for help on using the changeset viewer.