zaro

How to Hide the WordPress Admin Bar

Published in WordPress Admin Bar 5 mins read

You can effectively hide the WordPress admin bar by adjusting individual user profile settings, adding custom code to your theme's functions.php file, or by utilizing a dedicated plugin. This flexibility allows you to choose the method that best suits your needs, whether it's for a single user, specific roles, or site-wide.

The WordPress admin bar, sometimes referred to simply as "the bar," is a dark toolbar that appears at the very top of your WordPress site when you are logged in. It provides quick access to various administrative functions, such as creating new posts, editing pages, moderating comments, and accessing dashboard settings. While convenient for administrators and editors, it can sometimes be distracting or unwanted for certain users or on the front-end of a live site.

Methods to Hide the WordPress Admin Bar

Here are the most common and effective ways to hide the WordPress admin bar:

1. Hiding for Individual Users via Profile Settings

This method is ideal if you only want to disable the admin bar for a specific user or a few select users. It's straightforward and requires no coding.

To disable the admin bar for a particular user:

  • Navigate to Users: From your WordPress dashboard, go to Users > All Users.
  • Edit User Profile: Find the user for whom you want to hide the admin bar and click on their Edit link.
  • Uncheck Toolbar Option: On the user profile page, locate the option labeled "Show Toolbar When Viewing Site".
  • Save Changes: Uncheck this box, and then scroll down to click Update Profile.

Once updated, the admin bar will no longer appear for that specific user when they are logged in and viewing the front-end of the site.

2. Hiding Site-Wide or for Specific User Roles with Code

For a more comprehensive solution, especially if you want to hide the admin bar for all users or certain user roles (like subscribers or customers), adding code to your theme's functions.php file is a robust option. It is highly recommended to use a child theme when modifying functions.php to prevent losing your changes during theme updates.

a. Hide for All Users

To disable the admin bar for everyone who is logged in:

add_filter('show_admin_bar', '__return_false');

Add this line of code to the functions.php file of your active (child) theme. This will prevent the admin bar from appearing for all logged-in users, regardless of their role.

b. Hide for Non-Administrators (or Specific Roles)

If you only want administrators to see the admin bar, or want to hide it from all roles except for administrators, you can use a conditional check:

if (!current_user_can('administrator')) {
    add_filter('show_admin_bar', '__return_false');
}

Place this code in your theme's functions.php file. This snippet checks if the current user does not have the 'administrator' capability. If they don't, the show_admin_bar filter is applied, hiding the bar for them. You can modify 'administrator' to other roles like 'editor', 'author', 'contributor', or 'subscriber' to customize who sees the bar.

3. Using a WordPress Plugin

For those who prefer a no-code solution or need more advanced control over the admin bar's visibility, various WordPress plugins can help. These plugins often offer additional features like custom admin menus, white-labeling the dashboard, or restricting access to certain features.

Popular types of plugins that offer this functionality include:

  • Admin Customization Plugins: Many plugins designed to customize the WordPress admin area will include an option to hide or modify the admin bar.
  • User Role Editor Plugins: Plugins that manage user roles and capabilities often provide settings to control admin bar visibility based on roles.

Simply search for "hide admin bar" or "admin customization" in the WordPress plugin repository, install a reputable plugin, and follow its instructions to configure the settings.

4. Hiding with Custom CSS (Less Recommended)

While technically possible, hiding the admin bar with CSS is generally not recommended as it only visually conceals the bar but does not prevent it from loading in the browser. This means the HTML for the bar is still present, and it might still introduce a slight spacing issue or interfere with other elements, especially on mobile.

If you absolutely need a quick visual hide, you can add this CSS to your theme's custom CSS section (often found in Appearance > Customize > Additional CSS):

#wpadminbar {
    display: none !important;
}
html {
    margin-top: 0 !important;
}

The html { margin-top: 0 !important; } line is crucial to remove any top margin that WordPress adds to the html element to accommodate the admin bar.

Summary of Methods

Method Best For Ease of Use Requires Code Impact Considerations
User Profile Settings Individual users Easy No Per user Manual for each user
functions.php (Site-Wide) All logged-in users Moderate Yes Global Use child theme; affects all logged-in users
functions.php (Conditional) Specific user roles Moderate Yes Per role Use child theme; precise control over roles
WordPress Plugin No-code solution; advanced control Easy No Flexible (per user/role/global) Adds plugin overhead; choose reputable plugin
Custom CSS (Not Recommended) Quick visual hide; temporary Easy No Visual only; does not prevent loading Might cause layout issues; not a true disable

By choosing the appropriate method, you can effectively manage the visibility of the WordPress admin bar to enhance user experience and streamline your site's appearance.