Menu Close

How to Hide / Disable the WordPress Admin Bar

default

When you are logged into your WordPress site, the software automatically displays a toolbar at the top of the page. And whether you’re looking at the site from your dashboard or the front page of your website – the toolbar is always there. For many users, this is rather annoying and even more so when you’re developing the site.

If you’re a developer, this toolbar can really throw off the design of your front page, particularly if you have some CSS detail, which may be obscured by the admin bar. Even if you’re not a developer, you may find the admin bar too distracting.

So the question we have today is; can you somehow get rid of this little annoyance? Yes, and thankfully, you can remove it in just a few short minutes. Today, we’re going to show you how to disable your WordPress admin bar from your website using various methods.

How to Remove the WordPress Admin Bar Directly From the Dashboard

First, you need to login into your WordPress website and enter the dashboard. In order to disable the admin bar, click on Users and find Your Profile underneath it. There, under Keyboard Shortcuts, you’ll see Toolbar. You just uncheck the “Show toolbar when viewing the site” box right next to it.

And you’re actually all done. By unchecking this box, you won’t be able to see the toolbar on the front-end of your website. Of course, the software will continue to display it on the back-end of the site.

Due to the fact that the admin bar displays useful information like quick links to the front, creating new pages and posts, and access to your profile, you should definitely leave this version of the admin bar as is – after all, it contains some of the more important information about your website.

How to Disable the WordPress Admin Bar Using CSS

While the first method is without questions the easiest, this is a close second in terms of difficulty. You only have to copy and paste the CSS code below in Appearance > Customize > Additional CSS, or your style.css file.

The CSS code to disable the toolbar is:


#wpadminbar { display:none !important;}

How to Remove the WordPress Admin Bar Using a Plugin

While the solution above may be easy it isn’t the only way to remove the toolbar. You have a ton of plugins that are able to help you with the same problem. The most popular plugin is the Hide Admin Bar designed by Shelby DeNike which currently has 30,000+ active installs and a rating of 4.5/5 stars.

Luckily, there’s nothing to configure here at all, all you need to do is download the plugin, active it and your toolbar will be gone. It doesn’t get easier than that.

On the other hand, if you want to hide the toolbar for some user roles, you should download the Admin Bar Disabler by Scot Kingsley Clack instead. This plugin gives you an actual interface, where you can:

  • Blacklist the toolbar for certain users
  • Whitelist the toolbar for certain users
  • Disable the toolbar for everyone

You need to go to Settings and click on the Admin Bar Disabler. From there, you can customise everything you want. Although there are other toolbar-disabling plugins out there, we feel like these two are the best. If you can avoid using a plugin then that’s even better as too many plugins can obviously slow your site down; that and you can achieve the same in just a few lines of code without a plugin!

How to Remove the WordPress Admin Bar with Code

If you don’t want to download any additional plugins, don’t worry, you can also disable the toolbar with code. There are a few different ways to go about this and this is our preferred method out of them all.

For starters, if you want to disable the toolbar for all users, simply add this piece of code in your theme’s functions.php file:


add_filter('show_admin_bar', '__return_false');

Another code you can use that will disable the toolbar if added in functions.php is the following one:


function hide_admin_bar(){ return false; }
add_filter( 'show_admin_bar', 'hide_admin_bar' );

But maybe you don’t want to disable the toolbar for everyone. If you want to allow the users with administrative privileges to see the toolbar, you should just add this code instead:


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

And that’s all. As you can see, you don’t need to be an expert programmer to complete this task.

How to Remove Parts of the WordPress Admin Bar With Code

If you are looking for an easy solution to remove certain elements from the Toolbar you can do this using a code. First of all, you will need to search for the toolbar node ID for the element you want to be removed. You can find out more about this here.

For example, if you want to remove the WordPress logo from the toolbar use this code:


add_action( 'admin_bar_menu', 'remove_wp_logo', 999 );
function remove_wp_logo( $wp_admin_bar ) {
    $wp_admin_bar->remove_node( 'wp-logo' );
}

Easy enough, right?

Summary

In the end, whether you think the toolbar is affecting your design or you simply find it distracting, you know you can completely remove it whenever you want. We hope this little guide showed you that removing the admin bar is not such a hard job.

Also, keep in mind that you can always:

  • Remove the admin bar from your dashboard
  • Remove the toolbar using CSS
  • Download a plugin that will hide the admin bar
  • Use your coding skills to remove it
  • Or remove certain parts from it
  • Of course, if you have any questions, or know have a unique way of removing the admin bar, let us know in the comment section below.
View Source
Posted in WordPress