エディター用CSSが反映されなくなりました

なお、ここにエディター画面用cssを反映させているMy Snow monkeyのコードを記述したところ
「このサイトへのリクエストで潜在的に安全でない操作が検出されました。このサービスへのアクセスは制限されています。(HTTP 応答コード 403)」となってしまい、投稿できないようです。

Notion や Gist 等で共有してもらうことはできますか？

♥ 3

いいねをした人:

確かに反映されなくなってますね…。6.7 で挙動が変わったのかもしれません。

下記のように変更してみるとどうでしょうか？

add_action(
	'enqueue_block_assets', // フロントでもエディターでも実行される
	function() {
		// エディター以外では何もせずに終了させる
		if ( ! is_admin() ) {
			return;
		}

		// CSS を読み込み
		wp_enqueue_style(
			'my-snow-monkey',
			untrailingslashit( plugin_dir_url( __FILE__ ) ) . '/style.css',
			[ Framework\Helper::get_main_style_handle() ],
			filemtime( plugin_dir_path( __FILE__ ) )
		);
	},
	11
);

♥ 1

いいねをした人:

下記のコードに変更して、「HTML ソース上」に「11111」と「22222」が出力されるか確認してください。

add_action(
	'enqueue_block_assets', // フロントでもエディターでも実行される
	function() {
		var_dump(11111);
		// エディター以外では何もせずに終了させる
		if ( ! is_admin() ) {
			return;
		}

		// CSS を読み込み
		var_dump(22222);
		wp_enqueue_style(
			'my-snow-monkey',
			untrailingslashit( plugin_dir_url( __FILE__ ) ) . '/style.css',
			[ Framework\Helper::get_main_style_handle() ],
			filemtime( plugin_dir_path( __FILE__ ) )
		);
	},
	11
);

また、下記についても確認をお願いします。

– 読み込もうとしている CSS のパスはあっていますか？
– ブラウザのデベロッパーツールのネットワークタブで、読み込もうとしている CSS がロードされているか・404になっていないか確認してください。
– wp_enqueue_style() のハンドル名の指定を my-snow-monkey-editor に変更したらどうなりますか？
– wp_enqueue_style() の依存関係の指定を [] に変更したらどうなりますか？

♥ 1

いいねをした人:

ありがとうございます。もう var_dump() は消していただいて大丈夫です。

11111 も 22222 も表示されたということはちゃんとフックは通ってるみたいですね…。ブロックエディターは iframe バージョン（標準）と非 iframe バージョン（後方互換性のために残してある）の2つのバージョンがあって、6.7 からは非 iframe で表示される条件が狭くなりました。もし今エディターが ifarme で表示されているのであれば、その iframe の中で CSS が読み込まれている必要があります。enqueue_block_assets + wp_enqueue_style の場合は普通は正しく読み込まれるはずですが…。

エディターが iframe なのかそうでないのか、iframe の場合は iframe の中で my-snow-monkey/style.css が読み込まれているか確認してみてください。

読み込まれていることが確認できた場合、指定したセレクタに CSS が適用されているか確認してみてください（見た目ではなくデベロッパーツールで確認して、他の CSS で上書きされていないか確認してください）。

♥ 1

いいねをした人: