『ブロックを選択するには「/」を入力』の色を変えたい。Load My Files for Gutenbergを使って変える

ブログは背景が暗いもののほうが目が疲れないので好きなので、このブログも背景を暗くしています。

背景を暗くするので、テキストの文字は白っぽいものになります。

そうなると、投稿画面の

　　ブロックを選択するには「/」を入力　

が入力済みのテキストと似たような色になってしまい、混同してしまって見づらくなります。

それを解決するには、Load My Files for Gutenbergを使うと色を変更できます。

まずは、

GitHub

GitHub – ddryo/Load-My-Files-for-Gutenberg: ブロックエディターをベースにした制作用にCSSなどのファイ… ブロックエディターをベースにした制作用にCSSなどのファイルを読み込むだけの雛形プラグイン. Contribute to ddryo/Load-My-Files-for-Gutenberg development by creating…

で右上緑色のcode ボタンを押すとメニューがでるので、そのなかの一番下の「Download ZIP」ダウンロードをクリック

WordPresssのところへ行って「ブラグインを追加」を押して、zipファイルを追加していく

上の画面で「プラグインを追加」を押すと、以下のように画面が変わる。（変化がないように見ててしまうが、先程の画面では「プラグイン」［プラグインを追加］だが、次の画面では「プラグインを追加」［プラグインのアップロード］となっている。）

上の画面で［ファイルのアップロード］のボタンを押すと、以下の画面になる。

あとはzipファイルを選択して、プラグインを有効にする。

あとは説明にあるとおりだが、

サーバーのファイルマネージャなどで、

●●●/wp-content/plugins/Load-My-Files-for-Gutenberg-master/assets/css

の editor.cssをひらいて、

上の画面でeditor.cssを編集モードで開いたところに、

次のcss

/* 投稿編集画面のプレースホルダーの色（赤色red）　*/
.block-editor-rich-text__editable [data-rich-text-placeholder] {
   color: red;
}

を追加して「上書き保存」でOKだったはず。

暗い画面のブログの場合、これで作業しやすくなります。

/* 投稿画面のCSS */

div.block-editor-block-list__layout.is-root-container h2 {
color:yellow;
}

昔に試行錯誤して、このブログのサーバーの投稿画面のcss設定にはこう書いてあった。

/* 投稿画面のCSS */

div.block-editor-block-list__layout.is-root-container h2 {
margin-top:7em !important;
border-left: solid 15px var(--color_htag);
padding: .75em 2.5em;
background:;
border-radius:px;

}