Skip to content

Commit

Permalink
Remove the sizes attribute from thumbnail images in Twenty Nineteen
Browse files Browse the repository at this point in the history
The AMP runtime sets an inline style on an <amp-img> based
on the sizes attribute if it's present.
For example, <amp-img style="width:calc(50vw)">.
Removing the 'sizes' attribute isn't ideal, but it looks
like it's not possible to override that inline style.
This is only a workaround until the issue is addressed
in the amphtml repo.
  • Loading branch information
kienstra committed Nov 20, 2018
1 parent 93a3967 commit d7de7d1
Showing 1 changed file with 26 additions and 4 deletions.
30 changes: 26 additions & 4 deletions includes/sanitizers/class-amp-core-theme-sanitizer.php
Original file line number Diff line number Diff line change
Expand Up @@ -53,18 +53,20 @@ class AMP_Core_Theme_Sanitizer extends AMP_Base_Sanitizer {
protected static $theme_features = array(
// Twenty Nineteen.
'twentynineteen' => array(
'dequeue_scripts' => array(
'dequeue_scripts' => array(
'twentynineteen-skip-link-focus-fix', // This is part of AMP. See <https://github.com/ampproject/amphtml/issues/18671>.
'twentynineteen-priority-menu',
'twentynineteen-touch-navigation', // @todo There could be an AMP implementation of this, similar to what is implemented on ampproject.org.
),
'remove_actions' => array(
'remove_actions' => array(
'wp_print_footer_scripts' => array(
'twentynineteen_skip_link_focus_fix', // See <https://github.com/WordPress/twentynineteen/pull/47>.
),
),
'add_twentynineteen_masthead_styles' => array(),
'add_twentynineteen_image_styles' => array(),
'add_twentynineteen_masthead_styles' => array(),
'add_twentynineteen_image_styles' => array(),
'remove_twentynineteen_thumbnail_image_sizes' => array(),

),

// Twenty Seventeen.
Expand Down Expand Up @@ -342,6 +344,26 @@ public static function set_twentyseventeen_quotes_icon() {
} );
}

/**
* Remove the sizes attribute from thumbnail images in Twenty Nineteen.
*
* The AMP runtime sets an inline style on an <amp-img> based on the sizes attribute if it's present.
* For example, <amp-img style="width:calc(50vw)">.
* Removing the 'sizes' attribute isn't ideal, but it looks like it's not possible to override that inline style.
*
* @todo: remove when this is resolved: https://github.com/ampproject/amphtml/issues/17053
* @since 1.0
*/
public static function remove_twentynineteen_thumbnail_image_sizes() {
add_filter( 'wp_get_attachment_image_attributes', function( $attr ) {
if ( isset( $attr['class'] ) && false !== strpos( $attr['class'], 'attachment-post-thumbnail' ) ) {
unset( $attr['sizes'] );
}

return $attr;
}, 11 );
}

/**
* Add filter to adjust the attachment image attributes to ensure attachment pages have a consistent <amp-img> rendering.
*
Expand Down

0 comments on commit d7de7d1

Please sign in to comment.