投稿ページのタイトルが見づらいことの対処方法(自動的にタイトルを白文字にする) | WordPress

WordPressの投稿ページにおいてタイトルを編集するときに、下図のように青背景に黒文字で見づらいことはありませんか?
WordPress投稿画面の見づらいタイトル
この記事ではその対処方法として「ChromeおよびFirefoxにおいてCSS挿入アドインを用いて投稿ページのタイトルを自動的に白文字にする方法」を紹介します。

CSS挿入アドインの導入

WordPress投稿画面のタイトルを白文字にするためにCSSを挿入するアドインを導入しましょう。
CSS挿入アドインとしてここでは「Stylus」というアドインを使用します。

Chrome, FirefoxのStylusアドインページのURLは以下です。

■Chome
https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=ja

■Firefox
https://addons.mozilla.org/ja/firefox/addon/styl-us/

タイトルを白文字にするCSSを設定

Stylusアドインをブラウザに追加できたら次にタイトルを白文字にするCSSを設定しましょう。
ここではChromeの設定方法を紹介しますが、Firefoxでもほとんど同様です。

まず、chrome右上のStylusのボタンをボタンを左クリック→管理ボタンで管理画面を開きます。
タイトルを白文字にするCSSを設定
次に、新スタイルの作成ボタンを押して、スタイルを作成を開始します。
タイトルを白文字にするCSSを設定
以下のように入力をします。
・コード: #post-title-0 { color: white }
・適用先: 正規表現に一致するURL で https://./wp-admin/.
タイトルを白文字にするCSSを設定
左カラムの保存ボタンを押してスタイルの設定を完了します。
タイトルを白文字にするCSSを設定
WordPressの投稿画面を開き、さきほどのスタイルが有効になっていることを確認します。
有効になっていない場合は、さきほどのスタイル編集過程の適用先の欄が間違っています。
タイトルを白文字にするCSSを設定
最後にイトルが白文字になっていることを確認したら完了です。以下は例です。
白文字になったタイトル

まとめ

この記事ではWordPressの投稿画面のタイトルが見づらい問題について、Stylusというアドインを用いて自動的に白文字化する対処方法を紹介しました。
タイトルとURLをコピーしました