Blog / WordPress/ How to Modify the WordPress Admin Bar (Toolbar)

How to Modify the WordPress Admin Bar (Toolbar)

WordPress顶部的admin bar导航栏怎么修改?

How to Modify the WordPress Admin Bar

The WordPress Admin Bar (or Toolbar) provides logged-in users with quick access to key administrative functions. You can customize it using code to hide it, control its visibility by user role, remove default items, or add custom menus.

1. Hide the Admin Bar Completely

Add the following code to your theme's functions.php file to disable the Admin Bar for all users.

add_filter( 'show_admin_bar', '__return_false' );

2. Show Only for Administrators

To display the Admin Bar only for users with the Administrator role and hide it for others (e.g., Subscribers, Editors), use this code. It checks the user's capability.

if ( ! current_user_can( 'administrator' ) ) {
    add_filter( 'show_admin_bar', '__return_false' );
}

3. Remove Default Items and Add Custom Ones

You can remove unwanted default menus (like the WordPress logo, 'New', 'Comments') and add your own items using the wp_before_admin_bar_render hook.

function mytheme_admin_bar_menu() {
    global $wp_admin_bar;
    // Remove default items
    $wp_admin_bar->remove_menu( 'wp-logo' );
    $wp_admin_bar->remove_menu( 'new-content' );
    $wp_admin_bar->remove_menu( 'comments' );
    $wp_admin_bar->remove_menu( 'appearance' );
    $wp_admin_bar->remove_menu( 'updates' );
    // Add a custom menu item
    $wp_admin_bar->add_menu( array(
        'id'    => 'about-mytheme',
        'title' => '@ Contact Us',
        'href'  => 'https://example.com/contact'
    ) );
}
add_action( 'wp_before_admin_bar_render', 'mytheme_admin_bar_menu' );

Note: This code affects all users who see the Admin Bar. To apply changes only for administrators, add a capability check at the start of the function: if ( ! current_user_can( 'administrator' ) ) { return; }.

4. Add a Custom Menu with Submenus

You can create a parent menu with child items for more complex navigation.

function mytheme_admin_bar_custom_menu() {
    global $wp_admin_bar;
    // Add parent menu
    $wp_admin_bar->add_menu( array(
        'id'    => 'custom_menu',
        'title' => 'Quick Links'
    ) );
    // Add a child menu
    $wp_admin_bar->add_menu( array(
        'parent' => 'custom_menu',
        'id'     => 'my_orders',
        'title'  => 'My Orders',
        'href'   => admin_url( 'admin.php?page=orders' ),
        'meta'   => array( 'target' => '_blank' )
    ) );
}
add_action( 'wp_before_admin_bar_render', 'mytheme_admin_bar_custom_menu' );

About the meta parameter: The meta array sets HTML attributes for the menu link. Common keys include:

  • target: Link open behavior (e.g., _blank).
  • title: Title attribute (tooltip).
  • class: CSS class for the menu item.
  • html: Allows custom HTML inside the menu item.

Add all code to your active theme's functions.php or a custom functionality plugin. Always back up and test in a staging environment first.

Post a Comment

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