I'd like to get it so that all of my sites have a different color admin bar. Dev Staging and Production. I use Git to push my code.
Any help would be appreciated.
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It only takes a minute to sign up.
Sign up to join this communityI'd like to get it so that all of my sites have a different color admin bar. Dev Staging and Production. I use Git to push my code.
Any help would be appreciated.
You can use a filter to set the admin color scheme, which includes colors for the admin bar:
<?php // add a filter
add_filter('get_user_option_admin_color', 'wpse_313419_conditional_admin_color');
//
function wpse_313419_conditional_admin_color($result) {
// Dev: use 'light' color scheme
if(get_site_url() == 'http://dev.example.com') {
return 'light';
// Staging: use 'blue' color scheme
} elseif(get_site_url() == 'http://staging.example.com') {
return 'blue';
// Production (all other cases): use 'sunrise' color scheme
} else {
return 'sunrise';
}
} ?>
You can see the 8 built-in color schemes by editing a user's profile and viewing the "Admin Color Scheme" options at the top. You just use them as all-lowercase. The filter overrides any individual users' preferences and enforces the color scheme of your choice. If you like, you can also create your own custom color schemes.
If your Site URLs change often, you could take an additional step - when the theme is activated, save the environment as an Option, and then you can pull it using get_option
instead of get_site_url
.
Finally, if you want to just use a plugin to handle all this for you, there is at least one ready-made solution in the WP plugin repository.
Fortunately the solution you want is actually quite simple. Just use the 'wp_before_admin_bar_render'
action hook and output CSS to change the color
and background
of the HTML element with the id
of wpadminbar
.
Below is a bit of code you can save into a file in your theme and require()
from your theme's functions.php
file, add a plugin header and use as a plugin, add to an existing plugin and require()
it, or simply copy into /mu-plugins
and WordPress will load it automatically.
But be sure to modify the _get_color_pair()
function to return a different color pair depending on which host is doing the loading:
<?php
class WPSE_313419 {
static function on_load() {
add_action(
'wp_before_admin_bar_render',
[ __CLASS__, '_wp_before_admin_bar_render_99' ],
99
);
}
static function _wp_before_admin_bar_render_99() {
$color_pair = self::_get_color_pair();
$html = <<<HTML
<style type="text/css">
#wpadminbar{color:{$color_pair->color};background:{$color_pair->background};}
</style>
HTML;
echo $html;
}
/**
* Modify this function to return the colors you want
* based on the value of get_site_url() or based on
* a constant defined in each host's /wp-config.php.
*
* @return object
*/
private static function _get_color_pair() {
return (object)array(
'color' => 'white',
'background' => 'red',
);
}
}
WPSE_313419::on_load();
Any questions? Just ask.
Hope this helps.
-Mike