wp_enqueue_editor_block_directory_assets()


WordPressのwp_enqueue_editor_block_directory_assets()関数は、ブロックエディター内でブロックディレクトリのアセットをエンキューするために使用されます。主にプラグインやテーマ開発者がブロックディレクトリから追加されたブロックのスタイルやスクリプトを読み込む際に利用します。

構文

wp_enqueue_editor_block_directory_assets();

例1: 基本的な使用法

ブロックエディターにブロックディレクトリのアセットを読み込む最もシンプルな例です。

add_action('enqueue_block_editor_assets', 'wp_enqueue_editor_block_directory_assets');

例2: カスタムスクリプトと一緒に使用

ブロックディレクトリのアセットとカスタムスクリプトを同時にエンキューします。

function enqueue_custom_assets() { wp_enqueue_editor_block_directory_assets(); wp_enqueue_script('custom-script'); } add_action('enqueue_block_editor_assets', 'enqueue_custom_assets');

例3: テーマ内での利用

テーマのfunctions.phpでブロックディレクトリのアセットを読み込みます。

add_action('after_setup_theme', function() { add_theme_support('editor-styles'); add_action('enqueue_block_editor_assets', 'wp_enqueue_editor_block_directory_assets'); });

例4: プラグイン内での利用

プラグイン内でこの関数を使用してブロックディレクトリのアセットを読み込みます。

function my_plugin_enqueue_assets() { wp_enqueue_editor_block_directory_assets(); } add_action('enqueue_block_editor_assets', 'my_plugin_enqueue_assets');

例5: 条件付きでアセットを読み込む

特定の条件を満たした場合にのみブロックディレクトリのアセットを読み込みます。

function conditional_enqueue() { if (get_post_type() === 'page') { wp_enqueue_editor_block_directory_assets(); } } add_action('enqueue_block_editor_assets', 'conditional_enqueue');

例6: 複数のアセットをまとめて読み込む

ブロックディレクトリのアセットと他のアセットをまとめて読み込みます。

function multiple_assets() { wp_enqueue_style('theme-style'); wp_enqueue_editor_block_directory_assets(); } add_action('enqueue_block_editor_assets', 'multiple_assets');

例7: 非同期でのアセット読み込み

非同期でブロックディレクトリのアセットを読み込みます。

function async_enqueue() { add_filter('script_loader_tag', function($tag, $handle) { if ($handle === 'wp-block-library') { return str_replace(' src', ' async src', $tag); } return $tag; }, 10, 2); wp_enqueue_editor_block_directory_assets(); } add_action('enqueue_block_editor_assets', 'async_enqueue');

注意点

  • この関数はブロックエディター内でのみ動作します。
  • フロントエンドでの使用には適していません。
  • WordPress 5.5以降で利用可能です。

関連機能：