How to Add Custom Admin CSS to Your WordPress Site

Home » Snippets » How to Add Custom Admin CSS to Your WordPress Site
0

Created with:

Visibility: 

public

Creator: WPTurbo Team

Customize with WPTurbo AI
X

Add Snippet To Project

New Project
Add To Existing Project

Have you ever wanted to change the visual appearance of your WordPress admin dashboard to better suit your personal style or brand? Luckily, it’s possible to customize the admin CSS to change the look and feel of your dashboard. In this article, we’ll take a look at how to add a custom CSS file to the WordPress admin and give you some tips on how to make it look great.

					function wpturbo_custom_admin_css() {
    echo '<style>
        /* Your custom CSS styles go here */
    </style>';
}
add_action('admin_head', 'wpturbo_custom_admin_css');
				

The code snippet above describes a function called wpturbo_custom_admin_css(). This function is used to add custom CSS styles for the WordPress admin panel. By adding the custom CSS styles, you can customize the look-and-feel of the WordPress admin panel according to your requirements.

The echo statement inside the function adds HTML code that defines the custom CSS styles. You can modify the code to change the CSS styles to your liking.

Here's an example of how you could add some CSS styles to change the background color of the WordPress admin panel to green:

echo '<style>
body {
    background-color: green !important;
}
</style>';

By adding the "!important" keyword, it ensures that the new styles will always take precedence over previous styles for elements.

The final step in the code snippet is to hook the wpturbo_custom_admin_css() function into the admin_head action. The admin_head action is used to add custom code to the header section of the WordPress admin panel.

By hooking into admin_head, you can apply your custom CSS styles to the WordPress admin panel.

Please note that it is generally recommended to avoid modifying WordPress core files. Instead, it is recommended to add custom CSS styles via your own plugin or theme. This code snippet can be added to your plugin or theme directly or via an action hook.

Register an account to save your snippets or go Pro to get more features.