Rich text: allow disabling formats per-block basis#77687
Open
Rich text: allow disabling formats per-block basis#77687
Conversation
simison
requested review from
ajitbohra,
ellatrix,
fabiankaegy and
juanmaguitar
as code owners
simison
added
[Feature] Rich Text
|
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 Unlinked AccountsThe following contributors have not linked their GitHub and WordPress.org accounts: @intelligence. Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases. If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
|
Size Change: +313 B (0%) Total Size: 7.82 MB 📦 View Changed
ℹ️ View Unchanged
|
|
Flaky tests detected in f2a9171. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/25043782665
|
simison
added
[Type] New API
Member
|
Just cross linking with #46551 as it was kind of similar but got closed since it was technically possible for new custom rich text formats. This is a nice and much needed API though in my opinion :) |
simison
changed the title
simison
force-pushed
the
update/unregister-format-type-per-block
branch
from
d339aff to
f2a9171
Compare
Contributor
|
👋 Drive-by thoughts:
|
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?
Resolves #43084
Adds
unregisterFormatTypeInBlock( blockName, formatName )to@wordpress/rich-text, allowing format types like bold and italic to be disabled on a per-block-type basis rather than globally. For example:Previously,
unregisterFormatTypewas the only option and would remove the format from all blocks. The new function stores per-block disabled formats in thecore/rich-textstore and filters them out inuseFormatTypes, so the toolbar button simply never mounts for the affected block type while remaining available everywhere else.Includes tests and docs update.
Why?
Agencies and developers building sites for content authors often want to lock down the editor experience to avoid unintended styling for blocks, but do not want to use extra plugins like ACF or create their own custom blocks.
It's possible to lock down styling features via
theme.jsonor by filteringsupports, but rich text controls weren't possible to filter before.As an example, the agency might not want to allow customers to turn headings into cursive/bold, but keep the ability for paragraphs.
Previously, they could only disable cursive/bold globally:
How?
New API.
API is public in this PR, but I can put it behind a lock at first if desired.
The API only allows disabling one format per block, which can get cumbersome if you'd prerfer to disable everything. The next iteration could allow disabling an array of formats and/or an array of blocks for better developer ergonomics:
To disable all formats in specific blocks, one could:
To disable all formats in all blocks, one could:
Testing Instructions
Try different combos of disabling globally, disabling for specific blocks, and disaling only italic but not bold, etc:
Note that the toolbar buttons are gone, and you cannot change bold/italic via the keyboard either.
If you first change format and then apply the code, the formatting persists and isn't cleaned out. This keeps everything simpler and consistent with how globally disabling controls works. It's also useful for restricting styling for specific user roles.
If you first disable formats globally, then try to disable them for a block, you'll see error in console:
Test all 15 format types registered by
@wordpress/format-library:core/bold<strong>)core/italic<em>)core/code<code>)core/link<a>)core/strikethrough<s>)core/underline<u>)core/text-colorcore/subscript<sub>)core/superscript<sup>)core/keyboard<kbd>)core/language<bdi lang>)core/imagecore/mathcore/non-breaking-space )core/unknownTesting Instructions for Keyboard
Screenshots or screencast
Before
Both blocks have formatting tools:
After
Heading block doesn't have formatting tools:
Other blocks keep their formatting tools:
Use of AI Tools
Cursor/Sonnet 4.6