Docs: Add Documentation for Adding Block Variations Using get_block_type_variations Hook #68434
Conversation
|
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 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. |
| Here's an example of how to register a custom variation for the `core/navigation-link` block: | ||
|
|
||
| ```php | ||
| function my_custom_navigation_link_variations( $variations, $block_type ) { |
There was a problem hiding this comment.
I think a better example would be the following one:
function my_custom_image_variation( $variations, $block_type ) {
// Only modify variations for the navigation-link block
if ( 'core/image' !== $block_type->name ) {
return $variations;
}
// Add a custom variation
$variations[] = array(
'name' => 'wide-image',
'title' => __( 'Wide image', 'textdomain' ),
'description' => __( 'A wide image', 'textdomain' ),
'scope' => array( 'inserter' ),
'isDefault' => false,
'attributes' => array(
'align' => 'wide', // Identifies the link type as custom
),
);
return $variations;
}
add_filter( 'get_block_type_variations', 'my_custom_image_variation', 10, 2 );
As a 'core/image' variation doesn't need to be the children of another to be inserted (as it happens with core/navigation-link that can only be inserted inside of a ´core/navigation´)
Also in the example above there's a visual change that clarifies the use this variation.
There was a problem hiding this comment.
Hey @juanmaguitar, Thanks for the review! I appreciate the clarification. I've updated the example code accordingly to better reflect the correct usage of block variations for core/image.
|
Thank you very much @Sukhendu2002 for working on this. |
…ype_variations Hook (WordPress#68434) * Update doc to add PHP strategy to register block variations * Update example code * Add callout with link to relevant blog post --------- Co-authored-by: JuanMa <juanma.garrido@gmail.com>
…ype_variations Hook (WordPress#68434) * Update doc to add PHP strategy to register block variations * Update example code * Add callout with link to relevant blog post --------- Co-authored-by: JuanMa <juanma.garrido@gmail.com>
Issue: #63182
What?
This PR updates the Block Editor Handbook under the "Block API Reference > Variations" section to include detailed instructions on how to add block variations via PHP using the get_block_type_variations hook.
Changes Made: