Use Different Colors Scheme to Manage Your WordPress

Published in WordPress.

Watch our video

There is a better version of your web

Comparison of two variants of the same page using A/B testing

Share this post

Previously in this blog we have explained a checklist of steps to follow when creating a new WordPress installation. As you may already know, the default installation comes with some basic content and an administrator user. And this is what you see when you first log in:

WordPress dashboard
The WordPress Dashboard comes with a default color palette: the background of the left sidebar and top menu is shown in black and any section marked in blue.

The color scheme shown to manage a website is a combination of four colors in each palette. In the Users » Profile screen, you have nine palettes from which you can choose:

WordPress color schemes
WordPress admin color schemes.

As you can see in the image above, the default scheme uses a black and blue colorscheme. I’m sure you’re familiar with it: the sidebar and top bar are black and highlighted elements, buttons, etc. are blue. Being the default palette of WordPress, this is the color scheme that any new user of your website will have.

Changing the color scheme of your profile is as simple as accessing the section Users » Profile and click on the set of colors you want to manage your WordPress. You will immediately see how the new configuration already has its effect without the need to update.

Ocean WordPress Color Scheme
Ocean WordPress color scheme.

But changing the WordPress dashboard color scheme is not just a matter of taste. There is more than one situation in which doing so might be extremely helpful. Let’s look at a couple of cases.

User Roles

As we have already discussed in another post previously, the user with administration role can perform all the tasks that are available in the WordPress Dashboard. This includes management tasks such as modifying any basic file, adding or deleting plugins, creating new users and changing their roles and passwords, importing and exporting the site, and manipulating all the settings in general. You also have full control over any aspect related to design, being able to install, modify, and delete themes, widgets, and menus. And, of course, you have access to all the content that is published on your website: i.e. create, modify, and delete pages and posts, upload or delete multimedia files, and moderate comments.

The other roles in WordPress essentially constrain the capabilities a user is given:

  • Administrators has access to all administration tasks.
  • Editors can post and manage their own articles, as well as manage other users’ articles.
  • Authors can publish and manage their own posts solely.
  • Contributors can write and manage their own posts, but aren’t allowed to publish them.
  • Subscribers can read and comment.

Even if you have created the website and want to focus exclusively on the design and content of the pages that compose it, we believe that it is a serious mistake to use an administrator user for this task. In fact, users who publish content often have a public profile page that contains information (such as their username or database ID) that can be exploited by an attacker. If the user in question has an administration profile and their password is leaked, your website can be compromised.

Our recommendation to avoid security problems is to differentiate between users who are dedicated to generating content in WordPress (i.e. Editors, Authors, and Contributors), from users who are responsible for the administration (i.e. Admins). Even if you’re managing your site all by yourself, we strongly recommend you create at least one additional user with a role other than Administrator for content generation.

How do we know that we are using the user with the right role? In the upper right corner there’s a link to your profile. And you can also look at the left sidebar of the WordPress editor and check what menu options are available. For example, if you have the Plugins item, you’re probably an Administrator.

View of the actions to add a new plugin in WordPress
Add new plugin in WordPress

But if you want to avoid confusion and make sure that you only use the admin role when it’s due, the easiest way is to set and use a different colorscheme for admin users. For example, our administrator uses the Sunrise palette, which, with its reddish hue, makes it clear that we are using a “dangerous” user:

Admin User Color Scheme
Administrator color scheme.

In this way, if we see the WordPress interface in red, we immediately know that we should be extra careful, as we’re logged in as administrators.

Test or Development Environments

When you want to create a new website or make changes and adjustments to the one you already have, you probably want to test them first and thus make sure they do not negatively affect your website. The best way to do this is to create a local development environment or create a copy of your website in staging. For example, on more than one occasion for writing posts, I test the latest WordPress or Gutenberg news in a local environment than on this website.

If these environments are an exact copy of your production website, the only way to distinguish the sandbox from the production environment is by the site URL. Such a tiny difference between the two makes it very likely to make test changes in your live site (or viceversa)…

For this reason, our recommendation is to also use a different color scheme for your test or development environment. This way, you can easily tell it apart from the live site:

Sandbox Desktop
On my sandbox dashboard I use a different color scheme than the one I use in production.

As you can see, to differentiate user profiles or environments, color schemes help us avoid confusion.

How Do I Change the Color Scheme of Other Users?

As we have seen before, any user can change their own color scheme by accessing the Users » Profile section. We have also seen that when creating a new user, by default it has the default WordPress color.

With the admin role, if you want to change the color scheme once the user is already created, just go to the list of created users, look for the user you’re interested in, and change their colorscheme.

Option to edit a user
One user edit option.

Note, however, that any user can later change their color scheme to whatever they want. If you want to prevent that from happening, you have the option of installing a Force Admin Color Scheme plugin to:

  • Establish a specific default color scheme for each new user created, and
  • Eliminate the option to change the color scheme for users who are not administrators.
Force the same color scheme for all users
With the plugin Force Admin Color Scheme you can force the same color scheme for all users.

How Do I Create a Custom Color Scheme?

If the nine WordPress color schemes are not to your liking or you want to create a new custom color scheme, you can too! The easiest option to create new colorschemes is to go to the WordPress Admin Colors site.

After clicking on the Start Creating button, you have to indicate a name and an identifier for the new color scheme and by clicking on each of the different colors of the theme, you will be able to define your palette.

Customizing the generation of a new WordPress admin theme color scheme
Customization of the generation of a new color scheme of the WordPress administration theme.

You can change each of the colors and see a preview in real time of your selection:

New custom color scheme
New custom color scheme.

Finally, you only have to click on the Generate Color Scheme and a window will appear with the instructions on how to add the new color scheme to your WordPress.

Instructions for adding a color scheme to your WordPress
Instructions for adding a color scheme to your WordPress.

Here’s what you have to do. On the one hand, you must download the CSS style file of the created color scheme and upload it to the theme folder of your hosting server, public_html/wp-content/themes/nombre-del-tema/, using FTP. To upload files using FTP, you must first have downloaded and installed an FTP client program, such as FileZilla. FileZilla will ask you for your FTP credentials (hostname, username, and password) that you should have from your hosting company. Once connected to your server via FTP, you should see the list of folders it contains and find the one for your theme and you should upload the file that we have previously downloaded.

WordPress themes folder on the hosting server
WordPress themes folder on the hosting server.

Additionally, you must also add the snippet you have downloaded in the functions.php file of your theme or your child theme (much more recommended). Alternatively, you can install a plugin like Code Snippets to add this piece of code.

Add a piece of code with the Code Snippets plugin
Add a snippet with the Code Snippets plugin.

After adding the code snippet, you will now have the custom color scheme available on your WordPress to be added to the user of your choice.

New color scheme created in WordPress
New color scheme created in WordPress.

As you have seen, creating a new color scheme for your WordPress is quite simple and if you get used to using different colors for different user profiles and environments, you will surely avoid doing something you didn’t want to do by mistake.

Featured image of Mario Gogh on Unsplash.

Leave a Reply

Your email address will not be published. Required fields are marked: •

I have read and agree to the Nelio Software Privacy Policy

Your personal data will be located on SiteGround and will be treated by Nelio Software with the sole purpose of publishing this comment here. The legitimation is carried out through your express consent. Contact us to access, rectify, limit, or delete your data.