Skip to content

Instantly share code, notes, and snippets.

@vishalkakadiya
Last active December 12, 2022 16:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save vishalkakadiya/bd8ac01ef6824f5e2a70991168d189c3 to your computer and use it in GitHub Desktop.
Save vishalkakadiya/bd8ac01ef6824f5e2a70991168d189c3 to your computer and use it in GitHub Desktop.
Fix sizes attribute to improve Lighthouse score for core/image and multiple core/images on the page.
<?php
/**
* Modified version of https://core.trac.wordpress.org/attachment/ticket/45985/45985-regular-images.patch patch for testing.
* Full credit goes to that patch owner.
*/
/**
* Add custom `sizes` attribute to responsive image functionality for post content images.
*
* @since Twenty Nineteen 1.0
*
* @param string $sizes A source size value for use in a 'sizes' attribute.
*
* @return string A source size value for use in a content image 'sizes' attribute.
*/
function twentynineteen_calculate_image_sizes_attr( $sizes ) {
if ( is_admin() ) {
return $sizes;
}
return '(min-width: 768px) calc(8 * (100vw / 12) - 28px), (min-width: 1168px) calc(6 * (100vw / 12) - 28px), calc(100vw - (2 * 1rem))';
}
add_filter( 'wp_calculate_image_sizes', 'twentynineteen_calculate_image_sizes_attr', 10 );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment