WordPress.org

Make WordPress Core

Changeset 25802


Ignore:
Timestamp:
10/15/2013 11:23:08 PM (6 years ago)
Author:
lancewillett
Message:

Twenty Fourteen: better logic for featured image HTML output, and add fallback message for focusable anchor elements, for accessibility. Fixes #25325.

Location:
trunk/src/wp-content/themes/twentyfourteen
Files:
12 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-content/themes/twentyfourteen/content-aside.php

    r25769 r25802  
    1010
    1111<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    12     <?php twentyfourteen_featured_thumbnail(); ?>
     12    <?php twentyfourteen_post_thumbnail(); ?>
    1313
    1414    <header class="entry-header">
  • trunk/src/wp-content/themes/twentyfourteen/content-gallery.php

    r25769 r25802  
    2626
    2727<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    28     <?php if( is_single() && $image ) : ?>
    29     <div class="attachment-featured-thumbnail">
     28    <?php if ( is_single() && $image ) : ?>
     29    <div class="featured-thumbnail">
    3030        <?php echo wp_get_attachment_image( $image, 'featured-thumbnail-large' ); ?>
    3131    </div>
    3232    <?php elseif ( $image ) : ?>
    33     <a class="attachment-featured-thumbnail" href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>">
     33    <a class="featured-thumbnail" href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>">
    3434        <?php echo wp_get_attachment_image( $image, 'featured-thumbnail-large' ); ?>
    3535    </a>
  • trunk/src/wp-content/themes/twentyfourteen/content-image.php

    r25769 r25802  
    1010
    1111<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    12     <?php twentyfourteen_featured_thumbnail(); ?>
     12    <?php twentyfourteen_post_thumbnail(); ?>
    1313
    1414    <header class="entry-header">
  • trunk/src/wp-content/themes/twentyfourteen/content-link.php

    r25769 r25802  
    1010
    1111<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    12     <?php twentyfourteen_featured_thumbnail(); ?>
     12    <?php twentyfourteen_post_thumbnail(); ?>
    1313
    1414    <header class="entry-header">
  • trunk/src/wp-content/themes/twentyfourteen/content-page.php

    r25769 r25802  
    1010
    1111<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    12     <?php twentyfourteen_featured_thumbnail(); ?>
    13 
    14     <?php the_title( '<header class="entry-header"><h1 class="entry-title">', '</h1></header><!-- .entry-header -->' ); ?>
     12    <?php
     13        twentyfourteen_post_thumbnail();
     14        the_title( '<header class="entry-header"><h1 class="entry-title">', '</h1></header><!-- .entry-header -->' );
     15    ?>
    1516
    1617    <div class="entry-content">
  • trunk/src/wp-content/themes/twentyfourteen/content-quote.php

    r25769 r25802  
    1010
    1111<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    12     <?php twentyfourteen_featured_thumbnail(); ?>
     12    <?php twentyfourteen_post_thumbnail(); ?>
    1313
    1414    <header class="entry-header">
  • trunk/src/wp-content/themes/twentyfourteen/content-video.php

    r25769 r25802  
    1010
    1111<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    12     <?php twentyfourteen_featured_thumbnail(); ?>
     12    <?php twentyfourteen_post_thumbnail(); ?>
    1313
    1414    <header class="entry-header">
  • trunk/src/wp-content/themes/twentyfourteen/content.php

    r25769 r25802  
    1212
    1313<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    14     <?php twentyfourteen_featured_thumbnail(); ?>
     14    <?php twentyfourteen_post_thumbnail(); ?>
    1515
    1616    <header class="entry-header">
  • trunk/src/wp-content/themes/twentyfourteen/inc/customizer.php

    r25792 r25802  
    1919    $wp_customize->get_setting( 'blogname' )->transport        = 'postMessage';
    2020    $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';
    21    
     21
    2222    // Add the custom accent color setting and control.
    2323    $wp_customize->add_setting( 'accent_color', array(
  • trunk/src/wp-content/themes/twentyfourteen/inc/template-tags.php

    r25769 r25802  
    156156
    157157/**
    158  * Display featured image with appropriate HTML tag.
    159  *
    160  * @since Twenty Fourteen 1.0
     158 * Displays an optional featured image, with an anchor element
     159 * when on index views, and a div element when on a single view.
    161160 *
    162161 * @return void
    163  */
    164 function twentyfourteen_featured_thumbnail() {
    165     if ( ! post_password_required() ) :
    166         if ( has_post_thumbnail() && is_singular() ) :
    167         ?>
    168             <div class="attachment-featured-thumbnail">
    169                 <?php the_post_thumbnail( 'featured-thumbnail-large' ); ?>
    170             </div>
    171         <?php
    172         else :
    173         ?>
    174             <a href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>" class="attachment-featured-thumbnail">
    175                 <?php the_post_thumbnail( 'featured-thumbnail-large' ); ?>
    176             </a>
    177         <?php
    178         endif;
    179     endif;
     162*/
     163function twentyfourteen_post_thumbnail() {
     164    if ( post_password_required() )
     165        return;
     166
     167    if ( is_singular() ) :
     168    ?>
     169
     170    <div class="featured-thumbnail">
     171        <?php the_post_thumbnail( 'featured-thumbnail-large' ); ?>
     172    </div>
     173
     174    <?php else : ?>
     175
     176    <a class="featured-thumbnail" href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>">
     177    <?php if ( has_post_thumbnail() ) :
     178        the_post_thumbnail( 'featured-thumbnail-large' );
     179    else : ?>
     180        <p class="screen-reader-text"><?php _e( 'No featured image.', 'twentyfourteen' ); ?></p>
     181    <?php endif; ?>
     182    </a>
     183
     184    <?php endif; // End is_singular()
    180185}
  • trunk/src/wp-content/themes/twentyfourteen/rtl.css

    r25758 r25802  
    368368/* Mobile list style */
    369369@media screen and (max-width: 400px) {
    370     .list-view .attachment-featured-thumbnail img {
     370    .list-view .featured-thumbnail img {
    371371        float: right;
    372372        margin: 0 0 3px 10px;
  • trunk/src/wp-content/themes/twentyfourteen/style.css

    r25788 r25802  
    561561
    562562.attachment-featured-featured img,
    563 .attachment-featured-thumbnail img {
     563.featured-thumbnail img {
    564564    height: auto;
    565565    max-width: 100%;
     
    11081108 */
    11091109
    1110  .attachment-featured-thumbnail {
     1110 .featured-thumbnail {
    11111111    background: #767676;
    11121112    background-attachment: fixed;
     
    11241124}
    11251125
    1126 .attachment-featured-thumbnail:hover {
     1126.featured-thumbnail:hover {
    11271127    background: #919191;
    11281128    background-attachment: fixed;
     
    11321132}
    11331133
    1134 .attachment-featured-thumbnail img {
     1134.featured-thumbnail img {
    11351135    display: block;
    11361136    margin: 0 auto;
    11371137}
    11381138
    1139 .has-featured-image .attachment-featured-thumbnail,
    1140 .format-standard .attachment-featured-thumbnail {
     1139.has-featured-image .featured-thumbnail,
     1140.format-standard .featured-thumbnail {
    11411141    display: block;
    11421142}
     
    26382638
    26392639@media screen and (max-width: 400px) {
    2640     .list-view .attachment-featured-thumbnail {
     2640    .list-view .featured-thumbnail {
    26412641        background: none;
    26422642        min-height: 0;
     
    26452645    }
    26462646
    2647     .list-view .attachment-featured-thumbnail img {
     2647    .list-view .featured-thumbnail img {
    26482648        float: left;
    26492649        margin: 0 10px 3px 0;
     
    27082708
    27092709@media screen and (min-width: 401px) {
    2710     a.attachment-featured-thumbnail:hover img {
     2710    a.featured-thumbnail:hover img {
    27112711        opacity: 0.85;
    27122712    }
     
    28102810    }
    28112811
    2812     .list-view .site-content .has-featured-image .attachment-featured-thumbnail,
    2813     .list-view .site-content .format-standard .attachment-featured-thumbnail {
     2812    .list-view .site-content .has-featured-image .featured-thumbnail,
     2813    .list-view .site-content .format-standard .featured-thumbnail {
    28142814        margin-top: -49px;
    28152815    }
Note: See TracChangeset for help on using the changeset viewer.