ワードプレスのregister_block_type関数の使用方法・解説

2025年2月22日カスタムフィールド、プラグイン、ブロックエディター、ワードプレスコア

概要

register_block_type関数は、新しいカスタムブロックタイプをWordPressのブロックエディタ（Gutenberg）に登録するための関数です。この関数は、主に以下の機能を実装する際によく使用されます。

ウェブサイト用の特定のデザインや機能を持つカスタムブロックの作成。
ブロックに特定の属性や内容を追加する際の設定。
編集画面のインターフェースをカスタマイズするためのカスタムコントロールの提供。
管理者のための簡単な設定を追加するUIの提供。
特定の条件に基づいたカスタムブロックの表示を制御する。
サードパーティ製プラグインやテーマでカスタムブロックを容易に統合。
デフォルトのブロックを拡張して機能を追加する。
ブロック間でデータを連携させるための設定。

構文

register_block_type( $name, $args );

パラメータ

$name (string) : ブロックのユニークな識別子。
$args (array) : ブロックの設定オプションを含む配列。

戻り値

成功した場合は、登録したブロックの情報を含む配列を返します。失敗した場合はnullを返します。

関連する関数

使用可能なバージョン

WordPress 5.0以降で使用可能です。

コアファイルのパス

wp-includes/block.php

この関数のアクションでの使用可能性

アクション	使用可能性
mu_plugin_loaded
registered_post_type
plugins_loaded	〇
wp_roles_init
setup_theme
after_setup_theme
set_current_user
init	〇
register_sidebar
wp_loaded	〇
send_headers
parse_query
pre_get_posts
wp	〇
template_redirect
get_header
wp_head

サンプルコード

サンプルコード1: シンプルなビジュアルブロックの登録

function custom_block_register() {
    register_block_type( 'custom/simple-block', array(
        'editor_script' => 'block-editor-script',
        'render_callback' => 'render_simple_block',
    ));
}
add_action( 'init', 'custom_block_register' );

このコードは、custom/simple-blockという識別子を持つシンプルなカスタムブロックを登録します。また、エディター用のスクリプトと表示用のコールバック関数が指定されています。

引用元: https://developer.wordpress.org/reference/functions/register_block_type/

サンプルコード2: 属性を持つカスタムブロックの登録

function custom_block_with_attributes() {
    register_block_type( 'custom/attribute-block', array(
        'attributes' => array(
            'content' => array( 'type' => 'string' ),
            'color' => array( 'type' => 'string' ),
        ),
        'editor_script' => 'block-editor-script',
    ));
}
add_action( 'init', 'custom_block_with_attributes' );

このコードは、contentとcolorという属性を持つカスタムブロックを登録します。この属性は、編集者インターフェースでそのブロックを構成するために使用されます。

引用元: https://developer.wordpress.org/reference/functions/register_block_type/

サンプルコード3: カスタムスタイルの付与

function custom_styled_block() {
    register_block_type( 'custom/styled-block', array(
        'editor_style' => 'block-editor-style',
    ));
}
add_action( 'init', 'custom_styled_block' );

このコードは、カスタムスタイルを持つカスタムブロックを登録します。editor_styleで指定されたスタイルシートが、ブロックエディターでの表示に適用されます。

引用元: https://developer.wordpress.org/reference/functions/register_block_type/

サンプルコード4: 遅延読み込みのカスタムブロック

function lazy_load_custom_block() {
    register_block_type( 'custom/lazy-load-block', array(
        'render_callback' => 'lazy_load_render_callback',
        'enqueue_style' => 'lazy-load-style',
    ));
}
add_action( 'init', 'lazy_load_custom_block' );

このコードは、カスタムブロックを登録し、その表示を遅延読み込みするためのコールバックとスタイルを指定します。

引用元: https://developer.wordpress.org/reference/functions/register_block_type/

サンプルコード5: カスタムブロックのカテゴリ指定

function register_custom_block_category() {
    register_block_type( 'custom/category-block', array(
        'category' => 'common',
    ));
}
add_action( 'init', 'register_custom_block_category' );

このコードは、カスタムブロックをcommonカテゴリに分類して登録します。これにより、エディターでのブロックの整理が容易になります。

引用元: https://developer.wordpress.org/reference/functions/register_block_type/

この関数について質問するコメントをキャンセル