WordPress.org

Make WordPress Core

Changeset 41703


Ignore:
Timestamp:
10/03/2017 12:16:31 PM (2 years ago)
Author:
SergeyBiryukov
Message:

Twenty Seventeen: Change tag cloud format to a list (<ul>) for better semantics and accessibility.

List markup allows screen reader users to know in advance how many tags are within the list.

Props sami.keijonen.
Fixes #40184.

Location:
trunk/src/wp-content/themes/twentyseventeen
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-content/themes/twentyseventeen/functions.php

    r41342 r41703  
    543543
    544544/**
     545 * Modify tag cloud widget arguments to display all tags in the same font size
     546 * and use list format for better accessibility.
     547 *
     548 * @since Twenty Seventeen 1.4
     549 *
     550 * @param array $args Arguments for tag cloud widget.
     551 * @return array The filtered arguments for tag cloud widget.
     552 */
     553function twentyseventeen_widget_tag_cloud_args( $args ) {
     554    $args['largest']  = 1;
     555    $args['smallest'] = 1;
     556    $args['unit']     = 'em';
     557    $args['format']   = 'list';
     558    return $args;
     559}
     560add_filter( 'widget_tag_cloud_args', 'twentyseventeen_widget_tag_cloud_args' );
     561
     562/**
    545563 * Implement the Custom Header feature.
    546564 */
  • trunk/src/wp-content/themes/twentyseventeen/style.css

    r40883 r41703  
    25412541}
    25422542
    2543 .widget ul li + li {
     2543.widget:not(.widget_tag_cloud) ul li + li {
    25442544    margin-top: -1px;
    25452545}
     
    27342734/* Tag cloud widget */
    27352735
     2736.tagcloud ul li {
     2737    float: left;
     2738    border-top: 0;
     2739    border-bottom: 0;
     2740    padding: 0;
     2741    margin: 4px 4px 0 0;
     2742}
     2743
    27362744.tagcloud,
    27372745.widget_tag_cloud,
     
    27462754    -webkit-box-shadow: none;
    27472755    box-shadow: none;
    2748     display: inline-block;
    2749     float: left;
    2750     font-size: 14px !important; /* !important to overwrite inline styles */
    2751     font-size: 0.875rem !important;
    2752     margin: 4px 4px 0 0 !important;
    2753     padding: 4px 10px 5px !important;
     2756    display: block;
     2757    padding: 4px 10px 5px;
    27542758    position: relative;
    27552759    -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
Note: See TracChangeset for help on using the changeset viewer.