Add: Option to pick a pattern on page creation. #40034
Conversation
jorgefilipecosta
added
Needs Design
jorgefilipecosta
requested review from
TimothyBJacobs,
spacedmonkey,
ellatrix and
ajitbohra
as code owners
jorgefilipecosta
force-pushed
the
add/option-to-pick-a-pattern-on-page-start
branch
from
957816c
to
fa5587c
Compare
jorgefilipecosta
requested review from
ntwb,
nerrad,
mkaz,
ryanwelcher and
juanmaguitar
as code owners
jorgefilipecosta
force-pushed
the
add/option-to-pick-a-pattern-on-page-start
branch
2 times, most recently
from
c04eed4
to
c19587f
Compare
jorgefilipecosta
changed the title
|
Size Change: +608 B (0%) Total Size: 1.22 MB
ℹ️ View Unchanged
|
|
Thanks for the PR, it works as intended: The modal display of patterns doesn't look super great:
So I took the liberty of trying to push a column-count-based masonry layout and a more minimal modal treatment:
I forgot to enable scrollbars in the above, don't worry they're there. What do you think? CC: @jameskoster in case you can sanity check my code. It'd be good to test this at least in the major browsers. |
|
Should we use the same modal as #38997, IE include the carousel? This is testing well for me, and the code looks good. The only minor quirk I noticed was a big gap at the bottom of the modal:
I wasn't able to determine why this is happening though 🤔 |
|
That gap is the min-height of the modal, which is there to prevent it from jumping as the patterns load. Oh, and thank you for looking 🎖️ |
|
Can someone clarify for me if this is intended to be the default mode whenever a new page is created? To show a modal instead of going directly to editing the page content? |
|
On my test install (Windows, local, WP 5.9.3 rc1, Chrome), it took between 12 to 8 seconds for the modal to show up in the editor (time varied in the different attempts). If I do start to type immediately, the modal does not show at all, and I believe that is intended? Are these patterns only added for testing? -I do not think we should recommend placing a query block on a page post type. |
|
I would like to test out the PR but the Guenberg build is not working. Can you fix this @jorgefilipecosta ?
I believe it would also be helpful to add a blank pattern one can quickly select in the page pattern modal when creating a new page. I am though very hesitant in having the pattern modal show up by default when creating a new page. As I usually like to start with a blank page. I would have to every time I create a page to click the x to remove the pattern modal. A few users flows. User creates a page. User creates a page. User creates a page. I believe there are additional flows in creating a page that I am currently not seeing. |
jorgefilipecosta
force-pushed
the
add/option-to-pick-a-pattern-on-page-start
branch
from
c61ba78
to
ea99480
Compare
Hi @carolinan, yes this is intended to be the default mode when a new page is created. |
There are some issues with pattern preview loading, this is not directly related to this PR. @youknowriad was looking into this issues.
Yes if there is already some content on the page we don't show the modal.
Yes, these patterns are only for testing. They will not be the patterns that show up. @jasmussen, @jameskoster , @mtias should we include some default content patterns in the core? If so which patterns, or should we leave the default content patterns to the plugins and themes, and by default there are no content patterns (e.g: the modal does not appear). |
Good question @jameskoster, I'm also not sure of the UI. We could of course use a similar UI to query. We could keep this simple one, or we if we expect that many patterns will exist in the future we can even go for a more complex UI with categories etc. |
|
Hey @jameskoster I am thinking that instead of having the modal show up automatically when creating a new page that we could instead have a way in the sidebar to select to add a page template/pattern. This gives the option for the user to add a page pattern if they choose to do so. |
|
Regarding the way to say a pattern is the full content of a page currently we assign 'core/post-content' as a block type of a pattern. This seems like a good solution and avoids the addition of new APIs like an alternative where we would use a specific flag to mark that a pattern is for the full content of a page. Any thoughts on that? @mtias, @youknowriad would you prefer an alternative? I guess this modal may not be a good fit for all websites. So we need a way to disable it on plugins and themes. Currently a possible way to disable this modal is to unregister the patterns with 'core/post-content' block type (.e.g WP_Block_Patterns_Registry->get_all_registered() and WP_Block_Patterns_Registry->unregister_block_pattern on the ones with block type 'core/post-content' ) or to update the patterns with 'core/post-content' block type by registering them without 'core/post-content' block type if we still want the patterns to be available but just disable the modal. |
That seems like a good path. And also provides a simple way to disable the filter, change the CPT to remove this feature. |
It is not intended, I'm checking and not showing the modal if the post is empty but you have undo levels (e.g: it was not empty before) I'm not sure why the logic did not work, I will debug the issue. |
bph
added
the
Needs Dev Note
Could be cool yea. |
|
An interesting observation I found — it seems a theme is required to have more than one pattern with Is that intentional? If not, can anyone confirm? |
Confirming this with 6.0 beta-2 with TwentyTwentyTwo. Adding |
|
Is it correct that in 6.0 (beta 3) this is only available for the "Page" post type? :) |
Yes. |
It is possible to remove the functionality altogether programmatically using the following code sample (it is part of the dev note): |
|
Testing WP 6.0 RC 1. Currently a new page opens without showing the page pattern modal. I assume that there are no page patterns to choose from so that the new page opens without showing the modal. I will also assume that at a later stage there will be added page patterns so that we might suddenly see the page pattern modal show up upon creating a new page. |
jorgefilipecosta
removed
the
Needs Dev Note
Iterates on #39147. In order to streamline the user experience, the team has decided only to include a pattern picker on page start and not a template picker. This decision is in line with our goal to simplify the user interface and avoid overwhelming users with too many options. We considered adding a new flag to mark patterns as being for the full post content but decided that using the existing 'blockTypes' => array( 'core/post-content' ) option was a simpler solution.
This is done by adding 'blockTypes' => array( 'core/post-content' ).
Testing Instructions
I tested the pattern picker by creating a new page and selecting a pattern for the page. I confirmed that the pattern was applied correctly to the page, as expected.
Screenshots or screencast
@jameskoster, @jasmussen could you provide some design insights to make the modal look better? thank you in advance!