Add sizes attribute to Product gallery thumbnail images to better load the appropriate resolution (#52073)
* Add sizes attribute to Product gallery thumbnail images to better load the appropriate resolution * Add changelog file
This commit is contained in:
parent
b4605c75e5
commit
7125986053
|
@ -0,0 +1,4 @@
|
|||
Significance: patch
|
||||
Type: performance
|
||||
|
||||
Add sizes attribute to Product gallery thumbnail images to better load the appropriate resolution
|
|
@ -256,6 +256,7 @@
|
|||
onload: 'this.width = this.naturalWidth; this.height = this.naturalHeight',
|
||||
src: slide.attr('data-thumb'),
|
||||
srcset: slide.attr('data-thumb-srcset'),
|
||||
sizes: slide.attr('data-thumb-sizes'),
|
||||
alt: slide.attr('alt')
|
||||
})
|
||||
}
|
||||
|
|
|
@ -1659,6 +1659,7 @@ function wc_get_gallery_image_html( $attachment_id, $main_image = false ) {
|
|||
$full_size = apply_filters( 'woocommerce_gallery_full_size', apply_filters( 'woocommerce_product_thumbnails_large_size', 'full' ) );
|
||||
$thumbnail_src = wp_get_attachment_image_src( $attachment_id, $thumbnail_size );
|
||||
$thumbnail_srcset = wp_get_attachment_image_srcset( $attachment_id, $thumbnail_size );
|
||||
$thumbnail_sizes = wp_get_attachment_image_sizes( $attachment_id, $thumbnail_size );
|
||||
$full_src = wp_get_attachment_image_src( $attachment_id, $full_size );
|
||||
$alt_text = trim( wp_strip_all_tags( get_post_meta( $attachment_id, '_wp_attachment_image_alt', true ) ) );
|
||||
|
||||
|
@ -1696,7 +1697,7 @@ function wc_get_gallery_image_html( $attachment_id, $main_image = false ) {
|
|||
$image_params
|
||||
);
|
||||
|
||||
return '<div data-thumb="' . esc_url( $thumbnail_src[0] ) . '" data-thumb-alt="' . esc_attr( $alt_text ) . '" data-thumb-srcset="' . esc_attr( $thumbnail_srcset ) . '" class="woocommerce-product-gallery__image"><a href="' . esc_url( $full_src[0] ) . '">' . $image . '</a></div>';
|
||||
return '<div data-thumb="' . esc_url( $thumbnail_src[0] ) . '" data-thumb-alt="' . esc_attr( $alt_text ) . '" data-thumb-srcset="' . esc_attr( $thumbnail_srcset ) . '" data-thumb-sizes="' . esc_attr( $thumbnail_sizes ) . '" class="woocommerce-product-gallery__image"><a href="' . esc_url( $full_src[0] ) . '">' . $image . '</a></div>';
|
||||
}
|
||||
|
||||
if ( ! function_exists( 'woocommerce_output_product_data_tabs' ) ) {
|
||||
|
|
Loading…
Reference in New Issue