Skip to content

Add aspect ratio control for gallery block#71116

Merged
scruffian merged 8 commits intoWordPress:feat/aspect-ratio-for-gallery-blockfrom
dhananjaykuber:feat/aspect-ratio-for-gallery-block
Oct 6, 2025
Merged

Add aspect ratio control for gallery block#71116
scruffian merged 8 commits intoWordPress:feat/aspect-ratio-for-gallery-blockfrom
dhananjaykuber:feat/aspect-ratio-for-gallery-block

Conversation

@dhananjaykuber
Copy link
Copy Markdown
Contributor

Closes #66760

What?

Adds aspect ratio control to the Gallery block, allowing users to force all image blocks within the gallery to use the same aspect ratio for consistent visual presentation.

Why?

Currently the Gallery block displays images in their original aspect ratios, there is no way to control their aspect ratio.

How?

Add Aspect Ration control for gallery block.

Testing Instructions

  • Open a post or page in the block editor
  • Insert a Gallery block
  • Add multiple images with different aspect ratios (e.g., portrait, landscape, square)
  • In the Gallery block settings sidebar, locate the new "Aspect ratio" control
  • Select a different aspect ratio (e.g., "Square (1:1)" or "16:9")
  • Verify all images in the gallery now display with the selected aspect ratio
  • Save the post and verify aspect ratios are maintained on the frontend

Screenshots or screencast

Screenshot 2025-08-07 at 7 03 40 PM screencapture-localhost-8888-2025-08-07-18_51_42

@github-actions
Copy link
Copy Markdown

github-actions bot commented Aug 7, 2025

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: dhananjaykuber <dhananjaykuber@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>
Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: mtias <matveb@git.wordpress.org>
Co-authored-by: jhmonroe <jhmonroe@git.wordpress.org>
Co-authored-by: cbirdsong <cbirdsong@git.wordpress.org>

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

@t-hamano t-hamano added [Type] Enhancement A suggestion for improvement. [Block] Cover Affects the Cover Block - used to display content laid over a background image labels Aug 7, 2025
@mtias mtias added [Block] Gallery Affects the Gallery Block - used to display groups of images and removed [Block] Cover Affects the Cover Block - used to display content laid over a background image labels Aug 7, 2025
@mtias
Copy link
Copy Markdown
Member

mtias commented Aug 7, 2025

Thanks for working on this!

@mtias mtias added the [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi label Aug 7, 2025
@jhmonroe
Copy link
Copy Markdown

thank you! this is so critical! clients upload a million diff image ratios and expect multiple galleries to all look the same!

@tyxla tyxla requested a review from scruffian September 15, 2025 15:49
@scruffian
Copy link
Copy Markdown
Contributor

This is working great in my testing. Pinging @t-hamano also.

Copy link
Copy Markdown
Member

@tyxla tyxla left a comment

Choose a reason for hiding this comment

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

Looks like some tests should be updated with the new block.json attributes

Copy link
Copy Markdown
Contributor

@t-hamano t-hamano left a comment

Choose a reason for hiding this comment

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

Thanks for the ping! I don't have time to actually test it right now, but I'll take a look at the code and leave feedback on anything that bothers me.

@scruffian
Copy link
Copy Markdown
Contributor

@dhananjaykuber are you able to followup with these fixes?

scruffian and others added 4 commits October 6, 2025 10:01
Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>
Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>
Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>
Copy link
Copy Markdown
Contributor

@scruffian scruffian left a comment

Choose a reason for hiding this comment

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

I think this is ready to bring in now. Might be good to get a review from someone else.

@scruffian
Copy link
Copy Markdown
Contributor

This PR also needs the fixtures regenerating. I think the best way forward here might be to merge this into a different branch in Gutenberg and keep iterating there, so I can update it.

@scruffian scruffian changed the base branch from trunk to feat/aspect-ratio-for-gallery-block October 6, 2025 12:28
@scruffian scruffian merged commit a2129d6 into WordPress:feat/aspect-ratio-for-gallery-block Oct 6, 2025
63 of 67 checks passed
scruffian added a commit that referenced this pull request Oct 7, 2025
* Add aspect ratio control for gallery block (#71116)

Merging into a branch in the main repo so I can fix the tests.

* feat: Add aspect ratio control for gallery block

* Update packages/block-library/src/gallery/edit.js

Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>

* Apply suggestion from @scruffian

* Update packages/block-library/src/gallery/edit.js

Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>

* Update packages/block-library/src/gallery/edit.js

Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>

* Update packages/block-library/src/gallery/edit.js

* Update packages/block-library/src/gallery/edit.js

* Apply suggestion from @scruffian

---------

Co-authored-by: Ben Dwyer <ben@scruffian.com>
Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>
Co-authored-by: dhananjaykuber <dhananjaykuber@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>
Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: mtias <matveb@git.wordpress.org>
Co-authored-by: jhmonroe <jhmonroe@git.wordpress.org>
Co-authored-by: cbirdsong <cbirdsong@git.wordpress.org>

* update fixtures

* Update packages/block-library/src/gallery/edit.js

Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>

---------

Co-authored-by: Dhananjay Kuber <dhananjay.kuber@rtcamp.com>
Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>
Co-authored-by: dhananjaykuber <dhananjaykuber@git.wordpress.org>
Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: mtias <matveb@git.wordpress.org>
Co-authored-by: jhmonroe <jhmonroe@git.wordpress.org>
Co-authored-by: cbirdsong <cbirdsong@git.wordpress.org>
Co-authored-by: dhananjaykuber <dhananjaykuber@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: mikachan <mikachan@git.wordpress.org>
Co-authored-by: cbirdsong <cbirdsong@git.wordpress.org>
sidharthpandita1 pushed a commit to sidharthpandita1/gutenberg that referenced this pull request Oct 10, 2025
…ss#72104)

* Add aspect ratio control for gallery block (WordPress#71116)

Merging into a branch in the main repo so I can fix the tests.

* feat: Add aspect ratio control for gallery block

* Update packages/block-library/src/gallery/edit.js

Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>

* Apply suggestion from @scruffian

* Update packages/block-library/src/gallery/edit.js

Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>

* Update packages/block-library/src/gallery/edit.js

Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>

* Update packages/block-library/src/gallery/edit.js

* Update packages/block-library/src/gallery/edit.js

* Apply suggestion from @scruffian

---------

Co-authored-by: Ben Dwyer <ben@scruffian.com>
Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>
Co-authored-by: dhananjaykuber <dhananjaykuber@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>
Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: mtias <matveb@git.wordpress.org>
Co-authored-by: jhmonroe <jhmonroe@git.wordpress.org>
Co-authored-by: cbirdsong <cbirdsong@git.wordpress.org>

* update fixtures

* Update packages/block-library/src/gallery/edit.js

Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>

---------

Co-authored-by: Dhananjay Kuber <dhananjay.kuber@rtcamp.com>
Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com>
Co-authored-by: dhananjaykuber <dhananjaykuber@git.wordpress.org>
Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: mtias <matveb@git.wordpress.org>
Co-authored-by: jhmonroe <jhmonroe@git.wordpress.org>
Co-authored-by: cbirdsong <cbirdsong@git.wordpress.org>
Co-authored-by: dhananjaykuber <dhananjaykuber@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: mikachan <mikachan@git.wordpress.org>
Co-authored-by: cbirdsong <cbirdsong@git.wordpress.org>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Block] Gallery Affects the Gallery Block - used to display groups of images [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Support aspect ratio in gallery block

6 participants