Customize the WordPress 3.1 Admin Bar

If you have been searching on Google you’ll know there’s a lot of blogs explaining how to remove the new Admin Bar that WordPress 3.1 displays on the blog’s frontend. But what if what we want to do is customize it and only remove part of it, or add new links? Well, luckily WordPress provides us with some hooks to edit the Admin Bar in any way we want.

Adding menu & sub-menu items

Let’s say we want to add a new sub menu item for our theme’s custom Options Page. Most premium themes have one of these, and it might be handy to have a link to it…

function my_wp_admin_bar_theme_options() {
 global $wp_admin_bar;

 $wp_admin_bar->add_menu( array(
  'parent' => 'appearance',
  'id' => 'zillaframework',
  'title' => 'Classica Options',
  'href' => admin_url('themes.php?page=zillaframework')
 ) );
}
add_action( 'admin_bar_menu', 'my_wp_admin_bar_theme_options', 61 );

Here we have a simple hook that adds our new “Theme Options” link at the end of the Appearance menu. In the array of options we define the parent menu, an ID for our link, the title that will show in the link and it’s href value.  In the last line we hook our function to the admin_bar_menu action. The last number determines the position of our menu, but since we are already adding it to the Appearance sub-menu, this will not affect its position.

However it’s important not to use one of the numbers WordPress already uses, or our hook will be completely ignored. The magic numbers we can’t use are 10, 20, 30, 40, 50,60, 70 & 80. They correspond to the following default items:

• Account Menu (wp_admin_bar_my_account_menu): 10
• My Sites Menu (wp_admin_bar_my_sites_menu): 20
• Edit Link (wp_admin_bar_edit_menu): 30
• New Content Menu (wp_admin_bar_new_content_menu): 40
• Comments Link (wp_admin_bar_comments_menu): 50
• Appearance Menu (wp_admin_bar_appearance_menu): 60
• Updates Link (wp_admin_bar_updates_menu): 70
• Shortlink (wp_admin_bar_shortlink_menu): 80

As you can see only multiples of ten are used by WordPress. This makes it easy for us to add links exactly where we want. For example, if we want to add a link after the content Edit link, we can use a number from 31 to 39, like this:

function my_wp_admin_bar_google() {
 global $wp_admin_bar;

 $wp_admin_bar->add_menu( array(
  'id' => 'google',
  'title' => 'Google',
  'href' => 'http://www.google.com/'
 ) );
}
add_action( 'admin_bar_menu', 'my_wp_admin_bar_google', 35 );

Removing default items

Finally if we want to simply remove some of the current links or menus, we will use the remove_action() function (see list above for the names of each item), like this:

function remove_admin_bar_menus() {
 remove_action( 'admin_bar_menu', 'wp_admin_bar_my_account_menu' );
}
add_action( 'wp_footer', 'remove_admin_bar_menus' );

Notice that we are putting the remove_action inside a wp_footer hook so that it is loaded last, and not overwritten by WordPress core stuff.