10up / gutenberg-best-practices

Welcome to the 10up Gutenberg Best Practices!
https://gutenberg.10up.com
91 stars 24 forks source link

Add documentation for "Page creation Block Patterns" #40

Closed fabiankaegy closed 2 years ago

fabiankaegy commented 2 years ago

In WordPress 6.0 we've gained the ability to define block patterns as "post-content" patterns. If more than 2 of them are registered the user will be presented with a Modal that allows them to choose from all the post content patterns so that they don't have to choose from a blank slate.

This feature right now does not jet support custom post types in any way but is already very useful for Pages.

fabiankaegy commented 2 years ago

Supported fields

fabiankaegy commented 2 years ago

The DEV Note for the pattern registration via the /patterns directory can be found here: https://make.wordpress.org/core/2022/05/02/new-features-for-working-with-patterns-and-themes-in-wordpress-6-0/

fabiankaegy commented 2 years ago

The Dev note for this feature was just published: https://make.wordpress.org/core/2022/10/10/miscellaneous-editor-changes-for-wordpress-6-1/

Start content patterns for all post types

With WordPress 6.0, developers were able to add patterns that appear in a modal each time a new page was created, thus allowing the user to start from a set of pre-made patterns instead of a blank state. In WordPress 6.1, this feature is expanded to all the post types. To use this feature, one should include core/post-content in the blockTypes array (same as what happened for pages) and include the desired postTypes where the modal should appear in a newly introduced postTypes property. If postTypes are specified, the pattern is only available on the post types that were set.

Example:

register_block_pattern(
   'custom-pattern',
   array(
       'title'       => _x( 'Start post pattern', 'Block pattern title', 'gutenberg' >),
       'blockTypes'  => array( 'core/paragraph', 'core/post-content' ),
       'postTypes'   => array( 'product' >),
       'content'     => '<!-- wp:paragraph --><p>A start post pattern</p><!-- /wp:paragraph -->',
   )
);