enqueue_block_styles_assets()


WordPressのenqueue_block_styles_assets()関数は、ブロックエディタ用のスタイルアセットをキューに登録するために使用されます。Gutenbergブロックのスタイルを正しく読み込むために利用されます。

構文

enqueue_block_styles_assets();

例1: テーマのfunctions.phpでブロックスタイルを登録

テーマのfunctions.phpファイルでブロックスタイルをキューに追加します。

add_action('enqueue_block_assets','enqueue_block_styles_assets');

例2: カスタムブロックスタイルの追加

カスタムブロック用のCSSファイルを読み込みます。

wp_enqueue_block_style('core/paragraph',array('handle'=>'my-paragraph-style','src'=>get_theme_file_uri('assets/css/paragraph.css')));

例3: 複数のブロックスタイルを一括登録

複数のブロックに対してスタイルを適用します。

add_action('after_setup_theme',function(){add_theme_support('wp-block-styles');});

例4: ブロックスタイルの依存関係を設定

スタイルの依存関係を指定して読み込みます。

wp_enqueue_block_style('core/heading',array('deps'=>array('wp-edit-blocks')));

例5: インラインスタイルの追加

ブロックにインラインスタイルを直接追加します。

wp_add_inline_style('wp-block-library','.wp-block-heading{color:red;}');

例6: 条件付きでスタイルを読み込み

特定のページでのみブロックスタイルを読み込みます。

if(is_front_page()){enqueue_block_styles_assets();}

例7: ブロックスタイルのバージョン管理

スタイルファイルにバージョン番号を追加します。

wp_enqueue_block_style('core/image',array('ver'=>'1.0.0'));

注意点

  • この関数はWordPress5.8以降で推奨される方法です
  • スタイルの競合を避けるため、適切な優先順位を設定してください
  • フロントエンドとエディター用のスタイルを区別する必要があります

関連機能：