Before submitting an issue please check that you’ve completed the following steps:
Made sure you’re on the latest version => 2.2.2
Used the search feature to ensure that the bug hasn’t been reported before
Describe the bug
The first product image on the Woocommerce single product page does not convert to next-gen formats (WebP/AVIF) using the <picture> tag method. While other images, including those in the product gallery, are converted successfully, the first product image remains in its original format. The <img> tag is replaced with the <picture> tag, but it does not pull the next-gen version.
To Reproduce
Steps to reproduce the behavior:
Update to the latest versions of Woocommerce and Imagify.
Enable next-gen image display in Imagify settings and select the <picture> tag method.
Ensure next-gen versions are generated for all images.
Navigate to a Woocommerce single product page.
Observe that the first product image is not converted to next-gen format, while other images are.
Expected behavior
The first product image should convert to next-gen formats using the <picture> tag method, similar to the other images on the page.
The workaround is to use the rewrite rules method to display next-gen seamlessly.
Screenshots
Additional context
In my testing, I noticed that the gallery thumbnails (100x100) were not loading in next-gen formats. However, this was not the case in other user websites.
Acceptance Criteria (for WP Media team use only)
Clear instructions for developers, to be added before the grooming
Before submitting an issue please check that you’ve completed the following steps:
Describe the bug The first product image on the Woocommerce single product page does not convert to next-gen formats (WebP/AVIF) using the
<picture>
tag method. While other images, including those in the product gallery, are converted successfully, the first product image remains in its original format. The<img>
tag is replaced with the<picture>
tag, but it does not pull the next-gen version.To Reproduce Steps to reproduce the behavior:
<picture>
tag method.Expected behavior The first product image should convert to next-gen formats using the
<picture>
tag method, similar to the other images on the page.The workaround is to use the rewrite rules method to display next-gen seamlessly.
Screenshots
Additional context In my testing, I noticed that the gallery thumbnails (100x100) were not loading in next-gen formats. However, this was not the case in other user websites.
Acceptance Criteria (for WP Media team use only) Clear instructions for developers, to be added before the grooming