Changeset 3664 for sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/inc/template-tags.php

Timestamp:

07/10/2016 06:31:33 PM (8 years ago)

Author:

drewapicture

Message:

developer.wordpress.org: Add a 'Skip to note content' link to each user contributed note for the benefit of screen reader and keyboard users.

Note: While skip links are displayed during hover, active, and focus states, they are all absolutely positioned in the top left of the document which can result in their visibility falling outside the current viewport depending on scroll position.

Props keesiemeijer.
See #1819.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/inc/template-tags.php (modified) (2 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/inc/template-tags.php

@@ -137 +137 @@
             <li id="comment-<?php comment_ID(); ?>" <?php comment_class( $comment_class ); ?>>
             <article id="div-comment-<?php comment_ID(); ?>" class="comment-body">
+                <a href="#comment-content-<?php echo $comment->comment_ID; ?>" class="screen-reader-text"><?php _e( 'Skip to note content', 'wporg' ); ?></a> 
                 <header class="comment-meta">
                     <?php DevHub_User_Contributed_Notes_Voting::show_voting(); ?>
@@ -185 +186 @@
                 <!-- .comment-metadata -->
 
-                <div class="comment-content">
+                <div class="comment-content" id="comment-content-<?php echo $comment->comment_ID; ?>">
                     <?php comment_text(); ?>
                 </div>