Making WordPress.org


Ignore:
Timestamp:
04/14/2023 08:39:03 PM (14 months ago)
Author:
coffee2code
Message:

Photo Directory: Improve accessibility of displayed ALT text on single photo pages.

Props joedolson, alexstine, coffee2code.
See #6173.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-photos/template-parts/photo-single.php

    r12540 r12544  
    5656
    5757    <div class="entry-content">
    58         <figure>
    59             <?php $alt_text = get_the_content(); ?>
     58        <?php $alt_text = get_the_content(); ?>
    6059
    61             <a href="<?php echo wp_get_attachment_url( get_post_thumbnail_id() ); ?>" aria-label="<?php esc_attr_e( 'View larger photo', 'wporg-photos' ); ?>">
    62                 <?php
    63                 printf(
    64                     '<img class="single-photo" src="%s" srcset="%s" alt="%s">',
    65                     esc_url( get_the_post_thumbnail_url( get_the_ID(), 'medium') ),
    66                     esc_attr( wp_get_attachment_image_srcset( get_post_thumbnail_id() ) ),
     60        <a href="<?php echo wp_get_attachment_url( get_post_thumbnail_id() ); ?>">
     61            <?php
     62            printf(
     63                '<img class="single-photo" src="%s" srcset="%s" alt="%s">',
     64                esc_url( get_the_post_thumbnail_url( get_the_ID(), 'medium') ),
     65                esc_attr( wp_get_attachment_image_srcset( get_post_thumbnail_id() ) ),
     66                sprintf(
     67                    /* translators: %s: The alternative text for the photo. */
     68                    'View larger photo: %s',
    6769                    esc_attr( $alt_text )
    68                 );
    69                 ?>
    70             </a>
     70                )
     71            );
     72            ?>
    7173
    72             <?php if ( $alt_text ) : ?>
     74        </a>
    7375
    74             <figcaption class="wp-caption-text" aria-hidden="true">
    75                 <span><?php _e( 'Alternative Text:', 'wporg-photos' ); ?></span><?php echo wp_kses_post( $alt_text ); ?>
    76             </figcaption>
     76        <?php if ( $alt_text ) : ?>
    7777
    78             <?php endif; ?>
    79         </figure>
     78        <p class="photo-alt-text">
     79            <span><?php _e( 'Alternative Text: ', 'wporg-photos' ); ?></span><?php echo wp_kses_post( $alt_text ); ?>
     80
     81        </p>
     82
     83        <?php endif; ?>
     84
    8085    </div><!-- .entry-content -->
    8186
Note: See TracChangeset for help on using the changeset viewer.