One of the easiest ways to brand WordPress when doing client work is to add your web design business to the WordPress Admin Toolbar. Adding links and menu items to the WordPress Admin Toolbar is easily done through a simple add_action WordPress hook. In this example, we are adding a link to a fictitious webdev studio, as well as drop-down links to the Support, Billing, and News Updates of said fictitious webdev studio.
This code can be placed in the active theme's functions.php file.
function easy_add_menu_items_to_toolbar() {
global $wp_admin_bar;
if (!is_super_admin() || !is_admin_bar_showing())
return;
$wp_admin_bar->add_menu(array(
'id' => 'webdev_links',
'title' => __('Awesome WebDev'),
'href' => __('http://domain.com'),
));
$wp_admin_bar->add_menu(array(
'parent' => 'webdev_links',
'id' => 'support',
'title' => __('Get Support'),
'href' => __('http://domain.com/support'),
));
$wp_admin_bar->add_menu(array(
'parent' => 'webdev_links',
'id' => 'billing',
'title' => __('Pay Your Bill'),
'href' => __('http://domain.com/billing'),
));
$wp_admin_bar->add_menu(array(
'parent' => 'webdev_links',
'id' => 'news',
'title' => __('Latest News'),
'href' => __('http://domain.com/news'),
));
}
add_action('admin_bar_menu', 'easy_add_menu_items_to_toolbar', 25);
As you can see, each time we add_menu to the $wp_admin_bar we setup an array. Inside the array we have four different options.
- 'parent' - This is how we create a drop down menu. If you want a menu item to have a parent, you place the parent's 'id' inside your array.
- 'id' - This is the unique name for each menu item.
- 'title' - This is the text that appears to the end-user on the Toolbar menu item.
- 'href' - This is the url location of where you want the user to go when they select the menu item.
If you wanted to take it a step further, you could also assign CSS classes to individual menu items... which would be a great way to integrate icons/graphics into your WordPress Admin Toolbar. The following code will assign a CSS class of super-css-class to this newly added specific WordPress Admin Toolbar menu item.
$wp_admin_bar->add_menu(array(
'id' => 'super_css',
'title' => __('Super CSS'),
'href' => __('http://domain.com/supercss'),
'meta' => array(
'class' => 'super-css-class',
),
));
Bonus Content: You can also use this exact same code to remove items from the default WordPress Admin Toolbar. I prefer to create a different function when removing items. This way the adding of content happens in one function and the removing of content happens in another function.
function remove_admin_toolbar_links() {
global $wp_admin_bar;
$wp_admin_bar->remove_menu('wp-logo');
$wp_admin_bar->remove_menu('updates');
}
add_action('wp_before_admin_bar_render', 'remove_admin_toolbar_links');
The above code removes the WordPress logo from the Admin Toolbar and also the section that shows there are updates to WordPress (great to remove from clients). You can remove everything if you want and simply recreate the WordPress Admin Toolbar into a completely different beast. If you want to go down that road, here are the names of the sections you might want to remove.
- wp-logo - the WordPress logo
- my-account - links to your account. The ID depends upon if you have avatar enabled or not.
- site-name - site name with other dashboard items
- my-sites - the My Sites menu (if you have more than one site, multisite)
- get_shortlink - shortlink to the post/page
- edit - Post/Page/Category/Tag edit link
- new-content - Add New menu
- comments - Comments menu
- updates - Updates menu
- search - Search box
Are you currently modifying the WordPress Admin Toolbar for yourself or your clients?
Recent Comments