Editor: Extend "Apply globally" to inner blocks within parent#77097
Draft
Editor: Extend "Apply globally" to inner blocks within parent#77097
Conversation
|
Size Change: +562 B (+0.01%) Total Size: 7.74 MB 📦 View Changed
ℹ️ View Unchanged
|
Mamaduka
reviewed
Apr 7, 2026
Member
Mamaduka
left a comment
There was a problem hiding this comment.
An interesting concept. It would be nice to get design feedback.
Left some early code review notes.
|
Flaky tests detected in fb7a01e. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/24126754544
|
Member
Author
|
Thanks so much for your feedback, @Mamaduka 🙇
Yes - I like the idea of extending/improving on the existing options for styling similar blocks in the Advanced panel, but I'm not fully sure of how I've used the radio buttons. Would be good to see if there are any other ideas for how we could surface these options. |
Member
|
I think "Apply same styles to siblings" can be a bit more visible. It might be even better to avoid similarities with the "Apply globally" action. We want to avoid confusion and side effects; local changes have less impact and can be undone within the same entity. If the user mistakes "Apply globally" for the same thing, it can be problematic. |
Member
Author
|
Yeah, good point, we don't want to cause confusion between the two actions. What about using two separate sections, each with a distinct button, instead of the radio buttons? Something like this: 
|
Member
I like that. Do you think this is still an advanced setting? Maybe it should be more discoverable? Sorry, I don't have a better place in mind, but it seems like it's something that would be used more if users know about it. |
Member
|
I don't know if this the right idea, but do you think there are cases for which this feature would be turned on by default, e.g., via a block.json flag or something? I suppose the Accordion block is the most obvious. Or is it better to leave it up to the user. I'm just thinking a theme might want to turn this sort of behaviour on by default for other/custom blocks as well 🤔 |
Member
Author
Yeah, I'm also thinking it should probably be more discoverable. Maybe it should have its own section outside of Advanced.
Yes, I think so, and I guess that's where the automatic syncing approach comes in with something like the approach in #76489. I really like the idea of adding a block support for this. Maybe that could be an option with this PR, but to control showing the button or not? |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What?
Closes #76330
Alternative to #76489
This PR extends the existing "Apply globally" feature in the Advanced inspector panel to also support applying styles to same-type blocks within the same parent container (e.g. all Accordion Heading blocks within a single Accordion).
Why?
When working with blocks that repeat within a parent, like Accordion Headings, Buttons, or Navigation Links, there's no built-in way to keep their styles consistent without manually re-styling each one. The existing "Apply globally" button only targets Global Styles (site-wide), which is too broad when you may just want consistency within a single scope of a parent container.
This PR builds on the "Apply globally" UX to add a scoped alternative, so users can apply styles either to all matching blocks in the nearest parent container or globally across the site.
How?
A
useSiblingScopehook walks up the block tree from the selected block usinggetBlockParentsandgetClientIdsOfDescendants, looking for the nearest ancestor that contains at least one other block of the same type. It returns the ancestor's display title and the siblingclientIds.When siblings are found:
RadioControllets the user choose between the two scopes, with a single "Apply style changes" button. The scoped option is pre-selected as the more conservative default.Applying to siblings copies the block's style attributes to all sibling blocks in a single
registry.batch()call, giving a single undo step. Unlike "Apply globally", this does not clear the current block's local styles, since there is no site-level canonical store to fall back to.The
isBlockBasedThemegate is moved from the outer component into a prop, so the scoped button is available in both the post editor and site editor.Testing Instructions
Screenshots or screencast
Use of AI Tools
This PR was developed with the help of Claude Code. The implementation was reviewed and tested by the author.