こんにちわ、PHPエンジニアのエンジニア婦人（@naho_osada）です。
私はPHPエンジニアとして6年～の経験があります。WordPressは2年～の経験があります。
ここでは主に過去に納品した案件や自サイト運営（エンジニア婦人ノート）で遭遇したことについて書いています。
WordPress5.4以上のアップデートに伴い、Nao Lightは
「管理画面のエディタのフォントが適用されていない！」
問題を修正しました。
しかし、従来は適用されていたのに、どうして適用されなくなったのか？
原因：「そのクラスCSSが適用されなくなったから」
単純な話です。指定していたクラスのCSSが適用されなくなりました。
どうも、指定はちゃんと入っているものの、別のCSSで上書きされていたようです。
適用できる新しい書き方
管理画面のエディタに指定のフォントを適用するには、テーマ直下に「editor-style.css」を配置します。
そのファイルをfunction.phpで読みこませるように指定することで、その中に書いたCSSが反映されます。
editor-style.cssは以下の通りです。
div.editor-styles-wrapper {
font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
}「div.editor-styles-wrapper」です。divタグの中のeditor-styles-wrapperに適用させることで、エディタに指定のフォントを反映されるようになります。
参考）従来の書き方
.editor-block-list__block {
font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
}今まではこれで適用されましたし、検索するとこのやり方が当たると思います。
しかし、適用範囲を確認してみるとわかりますが、これだと5.4以降は上書きされています。
参考）管理画面のエディタにeditor-style.cssを適用させるfunction.phpの書き方
以下のようになります。「enqueue_block_editor_assets」にアクションフックをかけます。
function customEditorSettings() {
wp_enqueue_style('theme-editor-style', get_stylesheet_directory_uri() . '/editor-style.css');
}
add_action('enqueue_block_editor_assets', 'customEditorSettings');
楽しい物造りを
自分のブログやサイトを、楽しく作ってもらえたら。
プログラムを使って望み通りに、拡張しやすく、自分の思うように。
できたときに、すごく楽しい！と思ったら。
控えめに言って、「最高です」。
NaoLight -NAOT-（なおらいと、なおと、と呼んでください）はそんな思いをカタチにする、WordPressのテーマです。