Menu

Custom Menu Item Position In WordPress Admin Bar (Toolbar)

Custom Menu Item Position In WordPress Admin Bar (Toolbar)

When adding a new item to the WordPress Toolbar it's important to use admin_bar_menu hook. Sure, you can add new items with the wp_before_admin_bar_render hook for example but you cannot set item position. Position of the item is determined by add_action priority value, function with the lowest priority number is executed first.

These are the menus that WordPress adds by default and their priorities (positions):

As you can see above, comments_menu has a priority of 60 and if we were to add a new node with priority 50 it would be placed between Updates and Comments.

functions.php
function custom_node_example($wp_admin_bar){
    $args = array(
        'id' => 'custom-node',
        'title' => 'Custom Node',
        'href' => 'http://example.com/page/',
        'meta' => array(
            'class' => 'custom-node-class'
        )
    );
    $wp_admin_bar->add_node($args);
}

add_action('admin_bar_menu', 'custom_node_example', 50);

Priority is the third parameter in add_action, it defaults to 10 if left empty. Don't forget the menu item priorities when applying remove_node() function...

functions.php
add_action('admin_bar_menu', 'remove_some_nodes', 55);

function remove_some_nodes( $wp_admin_bar ) {
    // Updates will be removed because it's priority is 50
    $wp_admin_bar->remove_node('updates');

    // Comments will not be removed because it's priority is 60 and doesn't exist yet
    $wp_admin_bar->remove_node('comments');
}

It's easy to forget things like that when removing nodes so you might wanna use priority 999 or wp_before_admin_bar_render hook for removal.