【WP】ブロックパターンのサンプル

functions.php

/**
 * ブロックパターンを登録
 */
function my_block_patterns() {
	register_block_pattern_category(
		'my-block',
		array( 'label' => 'foobar' )
	);

	register_block_pattern(
		'my-pattern/test',
		array(
			'title'       => '買い物リスト',
			'description' => '買い物リストボックス',
			'categories'  => array( 'my-block' ),
			'content'     => '<!-- wp:group {"style":{"border":{"radius":"4px","width":"1px"},"spacing":{"padding":{"right":"var:preset|spacing|70","left":"var:preset|spacing|70","top":"var:preset|spacing|50","bottom":"var:preset|spacing|50"},"margin":{"top":"var:preset|spacing|80"}}},"borderColor":"my/border-gray","backgroundColor":"my/background-gray","layout":{"type":"constrained"}} -->
			<div class="wp-block-group has-border-color has-my-border-gray-border-color has-my-background-gray-background-color has-background" style="border-width:1px;border-radius:4px;margin-top:var(--wp--preset--spacing--80);padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--70)"><!-- wp:heading {"textAlign":"center","textColor":"my/accent","className":"is-style-heading-plain"} -->
			<h2 class="has-text-align-center is-style-heading-plain has-my-accent-color has-text-color">-買い物リスト-</h2>
			<!-- /wp:heading -->

			<!-- wp:list -->
			<ul><!-- wp:list-item -->
			<li>テキストを入力...</li>
			<!-- /wp:list-item -->

			<!-- wp:list-item -->
			<li>テキストを入力...</li>
			<!-- /wp:list-item -->

			<!-- wp:list-item -->
			<li>テキストを入力...</li>
			<!-- /wp:list-item --></ul>
			<!-- /wp:list -->
		)
	);

}
add_action( 'init', 'my_block_patterns' );