WordPress Admin Bar Theme API

Since version 3.0.0 of the plugin, WordPress Admin Bar has supported custom themes. If you are a WordPress theme developer, please consider including a WordPress Admin Bar theme with your WordPress theme. It’s easy to do, doesn’t take long to make, and will greatly improve the look and feel of the admin bar when used with your theme.

Adding A New WP Admin Bar Theme Via A WordPress Theme

First, copy one of the default themes’ stylesheets (for example grey.css) and place it in your theme’s folder. I’d name it wordpress-admin-bar.css if I were you.

Then open up your theme’s functions.php file. If your theme doesn’t have one, just create a blank PHP file and name it that.

Then place the following code in it:

if ( function_exists('wpabar_register_theme') )
	wpabar_register_theme( 'My Theme', 'my-theme', 'wordpress-admin-bar.css' );

wpabar_register_theme() parameters (all are required):

  1. The proper name of your theme. This is what users will see on my plugin’s options page. You can have it be translatable if you wish: __( 'My Theme', 'my-theme-text-domain' )
  2. A unique stub for your theme. I suggest using the same thing as your theme’s folder name.
  3. The path/filename, relative to the root of your theme folder, to the stylesheet.

Now that you have that set up, visit this plugin’s options page and select the new theme. From there, you can tweak the stylesheet and images to match your theme. It’s just standard CSS, so have at it.

Adding A New WP Admin Bar Theme Via A WordPress Plugin

Since everything inside of the wordpress-admin-bar folder gets deleted and replaced when you upgrade the plugin via the admin interface, it is strongly advised you do not modify any of the default themes or the plugin file in an attempt to add/customize your own theme.

Instead use the wpabar_themes filter. Here is some example plugin code:

<?php /*

Plugin Name:  My WP Admin Bar Theme
Description:  Adds a theme to the WordPress Admin Bar plugin.
Version:      1.0.0
Author:       My Name
Author URI:   http://www.mysite.com/


add_filter( 'wpabar_themes', 'myname_wpabar_theme' );

function myname_wpabar_theme( $themes ) {
	$themes['myname'] = array(
		'name' => 'My Theme',
		'css' => '/wp-content/plugins/myname-wpabar-theme/mytheme.css',

	return $themes;


8 thoughts on “WordPress Admin Bar Theme API

  1. I don’t know why, but on home page it isn’t work, I mean Admin bar current there unavaible and at this time on everyone other pages Admin bar work. Why? Where problem?

  2. I don’t know. Where and what I need to put to enable Admin Bar on home page (on pages like single post page Admin Bar works)?

  3. Hi Alex,

    I love your plugin. I have a lot of links under settings and the dropdown goes off the screen making it difficult to get to those options. Is there a way to make a scrollbar appear in the css if their are a lot of links or another rollover link to show more.


  4. justin on July 23rd, 2008 at 9:34 AM wrote:

    Is there a way to make a scrollbar appear in the css if their are a lot of links or another rollover link to show more.

    No, not easily. Just visit the plugin’s options page and disable some items you don’t need to access all the time.

    Oh, and I’m gonna close these comments. They’re meant for discussion the plugin’s API, but they’re only being used for support which should go in my forums or on the plugin’s homepage:


    If you need actual API help and the above content doesn’t help you, shoot me an e-mail.

  5. Pingback: Featured WordPress Plugin: WordPress Admin Bar - WordPress, Multisite and BuddyPress plugins, themes, news and help – WPMU.org

Comments are closed.