概要

• Gutenbergエディターでカスタムブロックを作成する手順について説明します。カスタムブロックを作成することで、WordPressサイトのコンテンツを柔軟にカスタマイズすることができます。
• この手順を実行するには、WordPress 5.0以降が必要であり、Gutenbergエディターが有効になっている必要があります。

サンプルコード

// カスタムブロックの登録
function register_custom_block() {
    register_block_type(
        'namespace/custom-block', // ブロック名
        array(
            'editor_script' => 'custom-block-editor', // エディタースクリプト
            'editor_style'  => 'custom-block-editor', // エディタースタイル
            'style'         => 'custom-block', // フロントエンドスタイル
        )
    );
}
add_action('init', 'register_custom_block');

解説

• `register_custom_block` 関数は、カスタムブロックを登録するための関数です。
• `register_block_type` 関数を使用して、カスタムブロックの登録を行います。第一引数にはブロック名を指定し、第二引数にはエディタースクリプト、エディタースタイル、フロントエンドスタイルなどを指定します。
• `add_action('init', 'register_custom_block')` で、WordPressの初期化時に `register_custom_block` 関数が呼び出されるように設定しています。

ベストプラクティス

• カスタムブロックを作成する際には、ブロック名やスタイルの名前に適切なプレフィックスを付けることで、他のプラグインやテーマとの競合を避けることが重要です。
• カスタムブロックのエディタースタイルは、Gutenbergエディターでの表示をカスタマイズするために活用できます。適切なスタイリングを行うことで、ブロックの編集画面を使いやすくすることができます。