Skip to content

Image block: fix lightbox srcset size#76092

Merged
sgomes merged 1 commit intotrunkfrom
fix/image-lightbox-srcset-size
Mar 4, 2026
Merged

Image block: fix lightbox srcset size#76092
sgomes merged 1 commit intotrunkfrom
fix/image-lightbox-srcset-size

Conversation

@sgomes
Copy link
Contributor

@sgomes sgomes commented Mar 3, 2026

What?

The image block currently generates the lightbox srcset without specifying a $size parameter to wp_get_attachment_image_srcset. This means that the $size parameter defaults to 'medium', per the method signature.

This PR changes that, to specify a larger size.

Why?

Some systems, like WordPress.com, rely on the $size parameter to determine the range of sizes to include in the srcset, to avoid including excessively large ones. In this case, since we're talking about a lightbox, the size that we're defaulting to ('medium') is not adequate, which leads to blurry images being shown, due to a lack of higher resolution options in the resulting srcset.

How?

This PR passes in an array with the image dimensions, when the image size is known. This ensures that the image can get displayed at the best possible resolution in the lightbox.

When the image size is unknown, it defaults to 'large' instead.

Testing Instructions

  • Create an image block with a very large image attachment (above 2000px wide, if possible)
  • Click the image to open the lightbox
  • Analyse the srcset on the image in the lightbox
  • Ensure that it includes large enough versions of the image

Testing Instructions for Keyboard

See the above instructions, but instead of clicking the image to open the lightbox, move focus to the image and hit the spacebar instead.

@sgomes sgomes requested a review from luisherranz March 3, 2026 15:51
@sgomes sgomes added [Type] Bug An existing feature does not function as intended [Block] Image Affects the Image Block Backport to WP 7.0 Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta labels Mar 3, 2026
@github-actions github-actions bot added the [Package] Block library /packages/block-library label Mar 3, 2026
@ellatrix ellatrix requested a review from t-hamano March 3, 2026 15:56
Copy link
Member

@luisherranz luisherranz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Reproduced the problem on a fresh installation and confirmed that this PR solves it.

Thanks, Sérgio!

@github-actions
Copy link

github-actions bot commented Mar 4, 2026

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: sgomes <sergiomdgomes@git.wordpress.org>
Co-authored-by: luisherranz <luisherranz@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@sgomes
Copy link
Contributor Author

sgomes commented Mar 4, 2026

Thank you for the review, @luisherranz! 👍

@sgomes sgomes merged commit db205d5 into trunk Mar 4, 2026
54 of 55 checks passed
@sgomes sgomes deleted the fix/image-lightbox-srcset-size branch March 4, 2026 09:56
@github-actions github-actions bot added this to the Gutenberg 22.7 milestone Mar 4, 2026
@github-actions github-actions bot removed the Backport to WP 7.0 Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta label Mar 4, 2026
gutenbergplugin pushed a commit that referenced this pull request Mar 4, 2026
Co-authored-by: sgomes <sergiomdgomes@git.wordpress.org>
Co-authored-by: luisherranz <luisherranz@git.wordpress.org>
@github-actions github-actions bot added the Backported to WP Core Pull request that has been successfully merged into WP Core label Mar 4, 2026
@github-actions
Copy link

github-actions bot commented Mar 4, 2026

I just cherry-picked this PR to the wp/7.0 branch to get it included in the next release: b9d2d1a

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Backported to WP Core Pull request that has been successfully merged into WP Core [Block] Image Affects the Image Block [Package] Block library /packages/block-library [Type] Bug An existing feature does not function as intended

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants