(+84) 463.28.7979

What Everybody Ought to Know about the WordPress Admin Bar v

In WordPress 3.1, a lot of cool features were added. Among those features was the WordPress Admin Bar. In this article, we will cover what is a WordPress admin bar, why it was added, and how you can utilize it for your benefits. This article will also show you how to remove the WordPress Admin Bar, how to remove links from the admin bar, how to add links in the admin bar, and much more.

What is the WordPress Admin Bar?

If you have used a WordPress.com blog, then you are already familiar with this. In WordPress 3.1, an administration bar was added to connect the back end to the front end of your blog. This feature will be most useful for people on multisite installs because they can add other useful links, advertisement, and much more on the admin bar for their registered users. It is also good for single-site users because it provides 1-click access to the dashboard.

WordPress Admin Bar

Why the WordPress Admin Bar?

According to Matt Mullenweg, this is the “first step toward a front-end editor”. The admin bar certainly makes life easier for a lot of beginners because it easily lets you edit the posts, write a new post, check the updates, get short-link, and more. We really like it because now our editors don’t have to look further to find abranded short-URL for our page. We have added it in our admin bar. It would be interesting to see how this Admin Bar evolves in the future versions.

Now lets get into what you can do with this Admin Bar. First thing would be how to remove it. A lot of people had an uproar about the admin bar because it was annoying.

How to Disable WordPress Admin Bar

The developers of WordPress made it really easy for you to disable the Admin Bar. Simply go to Users » Your Profile. Then simply check off the following:

Disable WordPress Admin Bar

But this is per user basis. If you are working on a site for a client and you want to get rid of it for each user, then simply open your theme’s functions.php file and paste the following code:

1 add_filter( 'show_admin_bar', '__return_false'

The code above will get rid of the admin bar, but it will leave the remains on the user profile page. To get rid of that, lets add this code:

1 add_action( 'admin_print_scripts-profile.php','wpbeginner_hide_admin_bar' );
2 function wpbeginner_hide_admin_bar() { ?>
3 <style type="text/css">
4 .show-admin-bar { display: none; }
5 </style>
6 <?php
7 }

Move the WordPress Admin Bar to the Bottom

By default, the Admin bar shows on top of each page. If you don’t like the placement, then you can move it to the bottom. Simply add this code in your theme’s functions.php file:

01 function stick_admin_bar_to_bottom_css() {
02 echo "
03 <style type='text/css'>
04 html {
05 padding-bottom: 28px !important;
06 }
08 body {
09 margin-top: -28px;
10 }
12 #wpadminbar {
13 top: auto !important;
14 bottom: 0;
15 }
17 #wpadminbar .quicklinks .menupop ul {
18 bottom: 28px;
19 }
20 </style>
21 ";
22 }
24 add_action('admin_head', 'stick_admin_bar_to_bottom_css');
25 add_action('wp_head', 'stick_admin_bar_to_bottom_css');

Now what would be interesting is to have the option to move the WordPress Admin Bar to the left or the right (similar to HootSuite backend). Designers can make it really interesting (giving WordPress a web app look in the front-end).

How to Remove Links from the WordPress Admin Bar

If you are interested in customizing the WordPress Admin Bar for your site or network, then you might not want all the links. Simply open your theme’s functions.php file and add this code:

1 function mytheme_admin_bar_render() {
2 global $wp_admin_bar;
3 $wp_admin_bar->remove_menu('comments');
4 }
5 add_action( 'wp_before_admin_bar_render','mytheme_admin_bar_render' );

The trick to this function is by knowing the IDs used for each link. You can find the IDs for the default links in WordPress 3.1 by looking the file: /wp-includes/admin-bar.php

Here are some of the default IDs:

my-account / my-account-with-avatar: the first link, to your account. Note that the ID here changes depending on if you have Avatars enabled or not.
my-blogs: the ‘My Sites’ menu if the user has more than one site
get-shortlink: provides a Shortlink to that page
edit: link to Edit [content-type]
new-content: the ‘Add New’ dropdown
comments: the ‘Comments’ dropdown
appearance: the ‘Appearance’ dropdown
updates: the ‘Updates’ dropdown

How to Add the Links in WordPress Admin Bar

If you are a plugin author, or a theme developer, you can certainly hook into the admin bar to make things easy. Plugins like WordPress SEO by Yoast, or WP-Bitlyalready does that. Here is a simple way of doing that, paste the following codes in your theme’s functions.php file:

01 function mytheme_admin_bar_render() {
02 global $wp_admin_bar;
03 $wp_admin_bar->add_menu( array(
04 'parent' => 'new-content',
05 'id' => 'new_media',
06 'title' => __('Media'),
07 'href' => admin_url( 'media-new.php')
08 ) );
09 }
10 add_action( 'wp_before_admin_bar_render','mytheme_admin_bar_render' );

If you want to create your own drop down in the admin bar, Michael Martin has apretty good tutorial on it.

Now this can feature can be abused by plugin developers. We have not seen it yet, and we hope that it stays this way. Only plugins that absolutely have to be added to the admin bar should be added. Most importantly, all plugin authors who do add their functions in the admin bar should have a check box to turn it off.


Coen Jacobs

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>