Yireo_Webp2
Yireo_Webp2 copied to clipboard
Support existing <picture> structure
Module works like charm for simple <img>
elements but is any possibility to support existing <picture>
element in code? I have in code existing <picture>
structure and it doesn't supported.
<picture>
<source media="(min-width: 480px)" srcset="https://example.com/media/image-for-desktop.jpg">
<source media="(max-width: 480px)" srcset="https://example.com/media/image-for-mobile.jpg">
<img src="https://example.com/media/image-for-desktop.jpg">
</picture>
Regards Matt
@mattkrupnik @jissereitsma We came across this the other day. Self-closing your source tag fixes the issue (or did for us).
So:
<picture> <source media="(min-width: 480px)" srcset="https://example.com/media/image-for-desktop.jpg" /> <source media="(max-width: 480px)" srcset="https://example.com/media/image-for-mobile.jpg" /> <img src="https://example.com/media/image-for-desktop.jpg"> </picture>
It's a workaround I guess, in the file yireo/magento2-next-gen-images/Image/HtmlReplacer.php
on line 102 this could be added.
if ($nextTag === '/picture' || $nextTag === '/source') {
@richjones87 Thanks. I've released 0.2.11 of NextGenImages with this fix. However, I think it does not fix the issue for @mattkrupnik . As I understand it, the problem of @mattkrupnik (but correct me if I'm wrong) is that WebP alternatives are not added to the existing picture
set. Adding that is actually quite complex and requires quite a bit more work ...
@jissereitsma I see 😄 thanks for the update on the module.