Black Friday & Cyber Monday SUPER SALE ALL WEEK:
Grab 40% OFF on plugins
00 Days
00 Hours
00 Minutes
00 Seconds

How to Add a Dropdown Field to Filter by Brands on the WooCommerce Shop Page?

With the release of WooCommerce 9.6.0, the Brands taxonomy was integrated into WooCommerce core. This update allowed store owners to create and categorize products by brand just like we do for product categories.

How to Add a Dropdown Field to Filter by Brands on the WooCommerce Shop Page? - Tyche Softwares

While this feature is incredibly useful for store owners, let’s make it even more beneficial for customers. In this guide, we’ll show you how to add a brand filter to the WooCommerce shop page, allowing customers to browse products by their favorite brands with ease.

Solution: Add a Dropdown Field to Filter by Brands on the WooCommerce Shop Page

This code adds a “Filter by Brand” dropdown to the WooCommerce shop page, allowing customers to filter products by their favorite brands.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
function ts_display_brand_filter_dropdown() {
if ( is_shop() || is_product_category() || is_product_taxonomy() ) {
$brands = get_terms( array(
'taxonomy' => 'product_brand',
'hide_empty' => true,
));
if ( ! empty( $brands ) ) {
echo '<form method="GET" action="' . esc_url( get_permalink( wc_get_page_id( 'shop' ) ) ) . '">';
echo '<select name="filter_brand" onchange="this.form.submit();">';
echo '<option value="">' . esc_html__( 'Filter by Brand', 'woocommerce' ) . '</option>';
foreach ( $brands as $brand ) {
$selected = ( isset( $_GET['filter_brand'] ) && $_GET['filter_brand'] == $brand->slug ) ? 'selected' : '';
echo '<option value="' . esc_attr( $brand->slug ) . '" ' . $selected . '>' . esc_html( $brand->name ) . '</option>';
}
echo '</select>';
echo '</form>';
}
}
}
add_action( 'woocommerce_before_shop_loop', 'ts_display_brand_filter_dropdown' );
function ts_filter_products_by_brand( $query ) {
if ( ! is_admin() && $query->is_main_query() && ( is_shop() || is_product_category() || is_product_taxonomy() ) ) {
if ( isset( $_GET['filter_brand'] ) && ! empty( $_GET['filter_brand'] ) ) {
$query->set( 'tax_query', array(
array(
'taxonomy' => 'product_brand',
'field' => 'slug',
'terms' => sanitize_text_field( $_GET['filter_brand'] ),
),
));
}
}
}
add_action( 'pre_get_posts', 'ts_filter_products_by_brand' );
function ts_display_brand_filter_dropdown() { if ( is_shop() || is_product_category() || is_product_taxonomy() ) { $brands = get_terms( array( 'taxonomy' => 'product_brand', 'hide_empty' => true, )); if ( ! empty( $brands ) ) { echo '<form method="GET" action="' . esc_url( get_permalink( wc_get_page_id( 'shop' ) ) ) . '">'; echo '<select name="filter_brand" onchange="this.form.submit();">'; echo '<option value="">' . esc_html__( 'Filter by Brand', 'woocommerce' ) . '</option>'; foreach ( $brands as $brand ) { $selected = ( isset( $_GET['filter_brand'] ) && $_GET['filter_brand'] == $brand->slug ) ? 'selected' : ''; echo '<option value="' . esc_attr( $brand->slug ) . '" ' . $selected . '>' . esc_html( $brand->name ) . '</option>'; } echo '</select>'; echo '</form>'; } } } add_action( 'woocommerce_before_shop_loop', 'ts_display_brand_filter_dropdown' ); function ts_filter_products_by_brand( $query ) { if ( ! is_admin() && $query->is_main_query() && ( is_shop() || is_product_category() || is_product_taxonomy() ) ) { if ( isset( $_GET['filter_brand'] ) && ! empty( $_GET['filter_brand'] ) ) { $query->set( 'tax_query', array( array( 'taxonomy' => 'product_brand', 'field' => 'slug', 'terms' => sanitize_text_field( $_GET['filter_brand'] ), ), )); } } } add_action( 'pre_get_posts', 'ts_filter_products_by_brand' );
function ts_display_brand_filter_dropdown() {
    if ( is_shop() || is_product_category() || is_product_taxonomy() ) {
        $brands = get_terms( array(
            'taxonomy'   => 'product_brand',
            'hide_empty' => true,
        ));

        if ( ! empty( $brands ) ) {
            echo '<form method="GET" action="' . esc_url( get_permalink( wc_get_page_id( 'shop' ) ) ) . '">';
            echo '<select name="filter_brand" onchange="this.form.submit();">';
            echo '<option value="">' . esc_html__( 'Filter by Brand', 'woocommerce' ) . '</option>';
            
            foreach ( $brands as $brand ) {
                $selected = ( isset( $_GET['filter_brand'] ) && $_GET['filter_brand'] == $brand->slug ) ? 'selected' : '';
                echo '<option value="' . esc_attr( $brand->slug ) . '" ' . $selected . '>' . esc_html( $brand->name ) . '</option>';
            }

            echo '</select>';
            echo '</form>';
        }
    }
}
add_action( 'woocommerce_before_shop_loop', 'ts_display_brand_filter_dropdown' );
function ts_filter_products_by_brand( $query ) {
    if ( ! is_admin() && $query->is_main_query() && ( is_shop() || is_product_category() || is_product_taxonomy() ) ) {
        if ( isset( $_GET['filter_brand'] ) && ! empty( $_GET['filter_brand'] ) ) {
            $query->set( 'tax_query', array(
                array(
                    'taxonomy' => 'product_brand',
                    'field'    => 'slug',
                    'terms'    => sanitize_text_field( $_GET['filter_brand'] ),
                ),
            ));
        }
    }
}
add_action( 'pre_get_posts', 'ts_filter_products_by_brand' );

Output

As we discussed earlier, the filter by brand dropdown will be displayed on the shop page. When a customer selects a particular brand, only products associated with that brand will be filtered and displayed as shown below.

How to Add a Dropdown Field to Filter by Brands on the WooCommerce Shop Page? - Tyche Softwares

To simplify store owners’ tasks, we have written various posts on adding filters to the admin side. One such useful customization is adding a custom filter to filter products by shipping class on the admin product page. Such filters are very useful for store owners to quickly filter out products that they need.

Browse more in: Code Snippets, WooCommerce How Tos, WooCommerce Tutorials

Share It:

Subscribe
Notify of


0 Comments
Newest
Oldest
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x
Privacy Overview

This website uses cookies so that we can provide you with the best user experience possible.

Cookie information is stored in your browser and performs functions such as recognising you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.

By using our site, you acknowledge that you have read and understood our Privacy Policy and Terms & Conditions.