How to Add a WooCommerce Order Number Search Field to the WP Admin Top Bar?

The WordPress admin is the centre place to control all the functionalities added to your site either via a plugin or custom code. We can make this page customized according to your specific usecase. For example, having a search field in the WP Admin top bar allows for quick access to order information without the need to navigate through WooCommerce >Orders page. When a customer enquires about their particular order, having a search field in the WP Admin top bar allows you to quickly access to order information. Let’s explore further to implement this feature into your store.

Solution: Add a WooCommerce Order Number Search Field to the WP Admin Top Bar

The code snippet will add a search form to the admin bar, enabling administrators to search for orders directly from the top bar. For example, if you’re on the Plugins page, you can enter an order number in the search bar and quickly search for an order without having to navigate back to the Orders page.

function ts_custom_admin_bar_search_form() {
    global $wp_admin_bar;

    $search_query = '';
    if (isset($_GET['post_type']) && $_GET['post_type'] == 'shop_order') {
        $search_query = $_GET['s'];
    }

    $wp_admin_bar->add_menu(array(
        'id' => 'custom_admin_bar_search_form',
        'parent' => 'top-secondary',
        'title' => '<form method="get" action="'.get_site_url().'/wp-admin/edit.php?post_type=shop_order">
            <input name="s" type="text" value="' . esc_attr($search_query) . '" style="height:20px;margin:5px 0;line-height:1em;"/> 
            <input type="submit" style="padding:3px 7px;line-height:1" value="Search Orders"/> 
            <input name="post_type" value="shop_order" type="hidden">
        </form>'
    ));
}
add_action('admin_bar_menu', 'ts_custom_admin_bar_search_form', 100);

Output

The order numbers search form will appear in the top-secondary section of the admin bar as shown in the output image below. Thus providing a quick and accessible way to search for orders without navigating away from the current page.

Note: No matter on which admin page you are (e.g., dashboard, posts, pages, plugins, settings), the search form will be available in the top bar of all pages within the WordPress admin area.

For example, if the admin searches for the order ID 1922, the search results will display orders based on the provided search term.

Did you find the search fields customization useful for spotting a specific order within seconds? Well, here’s another simple customization: adding additional context, such as appending customer email addresses and phone numbers to order numbers, can provide quick access to vital customer details at a glance. So that you don’t need to dig into order details, thus making your workflow more efficient and reducing the time spent on order management.