Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add srcset to Single Product gallery thumbnail images (#49112) 

* Add srcset to Single Product gallery thumbnail images

* Add changelog file
This commit is contained in:
Albert Juhé Lluveras 2024-07-08 17:23:07 +02:00 committed by GitHub
parent cecfecdf1f
commit 416db85d01
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
plugins/woocommerce/changelog/fix-48431-blurry-thumbnail-images Normal file
View File

@ -0,0 +1,4 @@
Significance: minor
Type: update
Make Single Product gallery thumbnail images sharper by defining a srcset

1
plugins/woocommerce/client/legacy/js/flexslider/jquery.flexslider.js
View File

@ -255,6 +255,7 @@
item = $('<img/>', {
onload: 'this.width = this.naturalWidth; this.height = this.naturalHeight',
src: slide.attr('data-thumb'),
srcset: slide.attr('data-thumb-srcset'),
alt: slide.attr('alt')
})
}

3
plugins/woocommerce/includes/wc-template-functions.php
View File

@ -1608,6 +1608,7 @@ function wc_get_gallery_image_html( $attachment_id, $main_image = false ) {
$image_size = apply_filters( 'woocommerce_gallery_image_size', $flexslider || $main_image ? 'woocommerce_single' : $thumbnail_size );
$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 );
$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 ) ) );
$image = wp_get_attachment_image(
@ -1631,7 +1632,7 @@ function wc_get_gallery_image_html( $attachment_id, $main_image = false ) {
)
);
return '<div data-thumb="' . esc_url( $thumbnail_src[0] ) . '" data-thumb-alt="' . esc_attr( $alt_text ) . '" 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 ) . '" class="woocommerce-product-gallery__image"><a href="' . esc_url( $full_src[0] ) . '">' . $image . '</a></div>';
}
if ( ! function_exists( 'woocommerce_output_product_data_tabs' ) ) {