Block Hooks APIの特徴
- ブロックはブロック フック API を使用して、テンプレート、テンプレート パーツ、パターンにのみ挿入できます。
- API はサイト編集と総合的に連携します。ブロックがフックされるとフロントエンドの挿入が自動的に行われますが、最終的な制御権はユーザーが持ちます。サイト エディターでは、ブロックを保持、削除、カスタマイズ、または移動することができ、それらの変更はフロントエンドに反映されます。
コード編集
Twenty Twenty-Fourのfunctions.phpに記入する
function example_block_hooks( $hooked_blocks, $position, $anchor_block, $context ) {
// テンプレート/テンプレートパーツ hooks.
if ( $context instanceof WP_Block_Template ) {
// 投稿ページのタイトルの前に"Like" button block をフックで挿入する
if (
// フックするブロックの種別
'core/post-title' === $anchor_block &&
// フックするブロックの相対位置
'before' === $position &&
// アンカー ブロックが属するブロック テンプレート、テンプレート パーツ、またはパターン
'single' === $context->slug
) {
// フック付きブロックの配列
$hooked_blocks[] = 'ockham/like-button';
}
// ヘッダーのナビゲーションブロックの後にログインログアウトブロックをフックで挿入する
if (
'core/navigation' === $anchor_block &&
'after' === $position &&
'header' === $context->area
) {
$hooked_blocks[] = 'core/loginout';
}
}
// パターン hooks.
if ( is_array( $context ) && isset( $context['slug'] ) ) {
// Twenty Twenty-FourのPost Metaブロックの後に、likeボタンをフックで挿入する
if (
'core/post-terms' === $anchor_block &&
'after' === $position &&
'twentytwentyfour/post-meta' === $context['slug']
) {
$hooked_blocks[] = 'ockham/like-button';
}
}
return $hooked_blocks;
}
add_filter( 'hooked_block_types', 'example_block_hooks', 10, 4 );