WordPress管理画面のアドミンバーの配色を変更する方法

WordPress管理画面のアドミンバーの配色を変更する方法

WordPress管理画面のアドミンバーの配色を変更する方法

通常、WordPress管理画面は、以下のようにアドミンバーとサイドバーが共通の配色になります。

アドミンバーとサイドバーが共通の配色

管理画面の配色は、[ユーザー] – [あなたのプロフィール]の「管理画面の配色」で変更したり、Admin Color Schemerというプラグインを使ってオリジナルの配色にすることができます。ですが、配色を変更しても、あくまでアドミンバーとサイドバーは共通の配色になり、アドミンバーだけ色を変えるという細かい設定はできません。

そこで今回は、アドミンバーのみ配色を変更する方法をご紹介したいと思います。

WordPress管理画面のアドミンバーの配色を変更する方法

アドミンバーのみ配色を変更するには、適用しているテーマのfunctions.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;」と「color:#fff;」の部分を変更すれば、自分の好きな配色にできます。

あとがき

完全に自己満足の世界ですが、アドミンバーだけ配色を変更したいと思ったら、ぜひ参考にしていただければと思います。

この記事が気に入ったら
いいね!してね♪

Twitter で

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です