WordPress管理画面のアドミンバーの色を好きに変更するカスタマイズ

ハシビィー君

WordPressの管理画面の配色を自由にカスタマイズしたいっす！

カピーさん

プロフィールから設定できるけど、さらに発展させた方法もお教えしよう。

【基本】WordPress「プロフィール」からの管理画面の配色変更

WordPressの管理画面の配色変更は【ユーザー→プロフィール】の「管理画面の配色」で変更することが可能です。

上記画像は「サンライズ」というパターンを選択したので、管理画面のアドミンバーの色が赤色に変更されているわけです。

使い道としては、複数ユーザーで管理運営を行なっている際に、一目でログインアカウントが分かるようにすることがあります。

その他には、複数のWordPressサイトを管理している際に、サイトごとに管理画面の色を変えるパターンという使い方があります。

ただWordPressの標準の機能では、現在上記9パターンでしか設定できません。

【応用】function.phpで配色を変更する

アドミンバーのみ配色を変更したい場合に、利用しているテーマの「function.php」に以下の内容を記述します。

//管理画面のアドミンバーの配色変更
function wp_adminbar_color() {
 echo '<style>#wpadminbar{background:#000;}#wpadminbar .ab-item, #wpadminbar a.ab-item, #wpadminbar>#wp-toolbar span.ab-label, #wpadminbar>#wp-toolbar span.noticon{color:#fff;}</style>';
}
add_action('admin_head', 'wp_adminbar_color');

「background:#000」の「#000」と「color:#fff;」の「#fff;」。この2か所を好きな色のコードを入力することで、自分の好きな配色を設定できます。

実際に反映させると上のバー部分のみ「黒色」に変更されていることが一目瞭然です。

個人的には上部だけは黒にしておくと、メリハリが生まれるので好きです。

まとめ：WordPress管理画面のアドミンバーの色を好きに変更するカスタマイズ

最後に『WordPress管理画面のアドミンバーの色を好きに変更するカスタマイズ』に関する結論を。