Cover Block: Use the description in the placeholder #34970
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
apeatling
added
the
[Block] Cover
|
@mtias & @jasmussen Interested in your feedback on wording here, and if we should keep some sort of instruction on uploading/grabbing from media library. |
|
We have neglected these a bit, but the idea was that they would include some guiding on how to get started — in this case, it should also mention something about dragging media into the block. In that sense, I think really good placeholders would tend to diverge from the block description rather than become one, or the block description would need to expand to include some of this guidance, which might feel out of place in sidebar inspector / previews. |
|
Size Change: +4.92 kB (0%) Total Size: 1.07 MB
ℹ️ View Unchanged
|
|
How about we use the description because it is succinct and clear, then add some instructions on the end, so:
|
The first sentence, aside from a hint in relation to headers, given the subsequent explanation and the UI controls themselves I think isn't required. So I think the instructional text you have would stand well on its own. Tweaks are my own and optional :) "Drag and drop an image or video onto this block or upload one from your device. If you have an existing image or video, you can select it from your media library." |
|
This works as advertised for me, except for other languages:
The info card in the right panel gets the description from the store via the useBlockDisplayInformation hook, which must be handling the translation. |
|
Updated with custom instructions based on what Ramon wrote:
|
Maybe overthinking it, but I wonder if something like |
I think it is worth this change just to really clarify what 'existing' means. |
|
One aspect to consider is that this text will be very useful the first time you see the cover block, and likely not that helpful the third, tenth, or 100th time you see it, so it feels worthwhile to temper the amount of text with that notion. In that light, I'd lean towards reducing the text to as little as can convey what it needs to. Even reducing the text discussed, and setting it to For the PR, be sure to test narrow contexts. The |
7 tasks
|
Trying to shorten it without losing information. How about:
|
ramonjd
approved these changes
Oct 5, 2021
|
Nice work. I think in absence of a redesign, we might want to try and shorten the text ever so sligtly more, because in most context it now wraps when before it didn't. Before: After:
The problem remains primarily that so much is going on in the placeholder already, and with two lines it actually grows a bit in height. Here it is with a different phrasing which I inspected in (I forgot the period at the end):
I also tried with 12px font size, but that looks off:
I think we need a holistic redesign of the base ingredients of the placeholder, separately from this PR. But it'd be nice if we could land on a phrasing that improves the description but still keeps it to one line. |
|
Thanks @jasmussen -- we can even drop the extra "a" in your reduction above, so with the period that will stay on one line: "Drag and drop onto this block, upload, or select existing media from your library." I think we can go ahead and merge this and then look at the wording further with the design updates coming. 👍 |
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.
Fixes #34707
Part of #28385
Description
Update the placeholder instruction text to describe what the block does, rather than just stating the obvious next steps. This has been updated to match the description text already present for the block.
How has this been tested?
Local testing.
Screenshots
Before:
After:
Types of changes
Non-breaking change.
Checklist:
*.native.jsfiles for terms that need renaming or removal).