ACF ブロックを作成してカスタムフィールドをブロックで利用する方法

概要

ACF ブロックを作成してカスタムフィールドをブロックで利用する方法について解説します。このスニペットは、WordPressのブロックエディターで独自のブロックを作成し、その中にACF（Advanced Custom Fields）で作成したカスタムフィールドを組み込む際に役立ちます。

ユースケース

WordPressのブロックエディターを使用して、柔軟でカスタマイズ性の高いコンテンツを作成したい場合にこのスニペットが必要です。ACFを使って作成したカスタムフィールドをブロック内で簡単に利用することができます。

前提条件

• WordPressがインストールされていること
• Advanced Custom Fields（ACF）プラグインが有効化されていること

サンプルコード

// ACF ブロックを登録
function register_acf_block() {
    acf_register_block(array(
        'name'              => 'custom-block',
        'title'             => __('Custom Block'),
        'description'       => __('A custom block with ACF fields.'),
        'render_template'   => 'template-parts/blocks/custom-block.php',
        'category'          => 'formatting',
        'mode'              => 'edit',
        'supports'          => array('align' => false),
    ));
}
add_action('acf/init', 'register_acf_block');

解説

• `register_acf_block` 関数は、ACFブロックを登録するための関数です。
• `acf_register_block` 関数には、ブロックの各種情報を設定します。`name` はブロックの識別名、`title` はブロックの表示名、`description` はブロックの説明です。
• `render_template` には、ブロック内のテンプレートファイルのパスを指定します。ここでは、'template-parts/blocks/custom-block.php' を指定しています。
• `add_action('acf/init', 'register_acf_block')` で、WordPressがACFを初期化した時に `register_acf_block` 関数が実行されるように設定しています。

ベストプラクティス

• ACFフィールドを使ってブロックをカスタマイズする際は、ブロック内でのフィールドの表示やサニタイズに十分注意してください。
• ACFフィールドの値をブロック内で表示する際は、適切なエスケープ処理を行い、セキュリティを確保してください。
• ACFブロックを作成する際には、ブロックの設定や表示に関する細かな要件を事前に整理し、スムーズな開発を行うことが重要です。