Add block variations for individual template parts #42454
Merged
Conversation
This file contains 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
talldan
added
[Feature] Inserter
|
@jameskoster I've created this PR to explore the third part from your comment (#42142 (comment)):
This is using the variation system at the moment. In practice it's very convenient, though a couple of issues:
|
|
Thanks for working on this @talldan !
Good observations, I agree that the preview would be very helpful. On a similar note, the descriptions that appear in the preview don't work so well. In the future it should be possible for each template part to have its own custom description, but until then we can probably hide it for these variations. For now it's probably ok to keep these in the Theme section of the Inserter. I appreciate that section is going to get very full when there are many template parts, but we should probably concentrate on how best to scale in a concentrated design exploration. Relevant discussion here, and #41379. Aside from the previews / description, the other offending issue is how particularly long names wrap on to so many lines. Since the full name appears in the preview, I think it might be ok to truncate in the Inserter panel. What do you think? |
|
Size Change: 0 B Total Size: 1.26 MB ℹ️ View Unchanged
|
talldan
force-pushed
the
try/template-part-instance-variations
branch
from
7eba98a to
733fcd0
Compare
|
@jameskoster I've pushed some extra commits:
|
talldan
changed the title
|
Nice, everything seems to be working well, and three-line truncation seems good. The preview is a little small but that's not something to address here unless it's easy to do so. There's some awkward behaviour in the quick inserter – when a search returns patterns and template parts, the patterns are given visual prominence which is probably the opposite of what we want. I'll open an issue to discuss that. cc @WordPress/gutenberg-design for thoughts on this PR. |
|
My initial thought is that it would crowd the Block Inspector with a lot of Header and Footer Template Parts. I am thinking that first one needs to rethink the block inserter and then think about how to present template parts in an easier way. |
carolinan
approved these changes
Jul 26, 2022
|
Thanks for reviewing 😄 I'll go ahead and merge this, if there's more feedback I'm happy to make further changes or revert the PR. |
matiasbenedetto
added a commit
that referenced
this pull request
Jul 27, 2022
This reverts commit 8d2e12d.
This was referenced Sep 4, 2022
ramonjd
reviewed
Sep 6, 2022
| const isReusable = isReusableBlock( item ); | ||
| return ( | ||
| <div className="block-editor-inserter__preview-container"> | ||
| <div className="block-editor-inserter__preview"> | ||
| { isReusable || hoveredItemBlockType?.example ? ( |
There was a problem hiding this comment.
Thanks for spotting that.
I thought this component was only part of the Inserter, so didn't think to test that. Perhaps it should be renamed.
38 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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 #31748
Adds a variation for each individual template part. Makes it so that users can see individual template parts like 'Header (dark, large)' (from TT2) in the inserter. The goal is to make it easier to insert existing template parts directly from the inserter.
Why?
This is part of the discussion here - #42142 (comment)
The plan at the moment is to explore quicker and easier ways for users to insert existing template part content (both existing template parts and patterns).
How?
Adds additional block variations by expanding on the PHP code that adds area variations.
Testing Instructions
Screenshots or screencast