Configure category browsing and breadcrumb navigation

Prev Next

# Configure category browsing and breadcrumb navigation

This article is for Salesforce admins, implementation partners, and solution consultants who need to control how buyers browse storefront categories and return to the catalog.

These settings control category-navigation behavior and presentation in Experience Builder. They do not change the underlying category hierarchy or product data.

When to use the storefront category filter component

Use Catalog - Category Filters (LWC) when buyers need to browse the catalog by category, move back up the category path with breadcrumbs, and optionally refine product results from the same page.

This component is a good fit when you need to:

  • control whether buyers browse top-level categories only or also see subcategories
  • start buyers inside a predefined main category
  • decide whether breadcrumbs are shown above the category menu
  • keep category browsing and product filtering together on the same storefront page

If you only need deeper product-filter setup, field mapping, or product-list behavior, use the related product-discovery configuration article instead of expanding this page with filter-specific setup details.

Before you begin

Before you update the page configuration, confirm the following:

  • Your storefront page already includes the catalog or product-list experience where category browsing should appear.
  • You know which named page should act as the buyer's catalog return destination.
  • You know whether buyers should browse at Level 1 only or continue into Level 2 subcategories.
  • You can publish the page and validate the result in the live storefront.

Add the category filter to the page

  1. Open the storefront in Experience Builder.
  2. Open the page where buyers browse the catalog.
  3. Add the component labeled Catalog - Category Filters (LWC).
  4. Select the component and open its property panel.
  5. Configure the category-navigation settings described below.
  6. Save and publish the page when configuration is complete.

Choose the visible category level strategy

Display Category controls how much category depth buyers can browse directly from the component.

Value What buyers see When to use it
Level 1 Buyers see only top-level categories. Subcategories are not displayed from the category menu. Use this when the catalog should stay simple or when top-level categories are enough for product discovery.
Level 2 Buyers can browse into subcategories from the category menu. Use this when buyers need more precise navigation inside larger or more detailed catalogs.

Choose Level 1 when you want a shorter menu and a simpler buyer path.

Choose Level 2 when the top level is too broad and buyers need to drill into a second category level before reviewing products.

Direction and Display Menu Links As change how this navigation is presented, but they do not change which categories exist or which category data is available.

Configure predefined main-category browsing

Main Category preselects a category so buyers enter the storefront in a defined part of the catalog instead of starting from the full top-level category list.

This is useful when:

  • a page is dedicated to one product family
  • a dealer portal should land buyers in a specific part of the catalog
  • category browsing should begin from a known business context instead of the full catalog root

When Main Category is set and Display Category = Level 2, OrderCentral preserves the expected Level 2 browsing behavior. Buyers still see the selected main category's subcategories instead of losing subcategory navigation because the main category was preselected.

Use these related settings together:

Setting What it controls Guidance
Main Category The predefined category context for the page. Set this when the page should open inside a specific catalog branch.
Display Category Whether buyers browse only the top level or also see subcategories. Pair Main Category with Level 2 when buyers should land directly in a chosen product family and continue into its subcategories.
Default Product Page The named page used when category navigation needs a catalog return destination. Leave this blank only if Commerce_Catalog is the correct fallback named page for your storefront.

Default Product Page falls back to Commerce_Catalog when no value is provided.

Configure menu presentation and buyer flow

Use the remaining component settings to control how category browsing is shown on the page.

Setting What it changes What it does not change
Direction Displays the category menu horizontally or vertically. It does not change category hierarchy, selected category logic, or breadcrumb behavior.
Display Menu Links As Changes whether submenu items are shown as Links Only or Icon And Title. It does not change the category structure or which categories are available.
Display main menu while filtering Changes the browsing flow by determining whether the main category menu should remain available while buyers refine product results. Use this when buyers should keep navigating between categories during filtering instead of focusing only on the filtered results area. It does not change category data or product-filter definitions.
Enable product filtering Shows or hides the product-filter area that appears alongside category browsing. It does not change the category menu itself.

Treat Direction and Display Menu Links As as presentation choices. Choose them based on page layout, available space, and how visually prominent category browsing should be.

Treat Display main menu while filtering and Enable product filtering as buyer-flow choices. Use them to decide whether the page behaves more like a guided catalog browser, a filtering workspace, or a blend of both.

Configure breadcrumbs and catalog return behavior

Display bread crumbs controls whether buyers see a breadcrumb path above the category menu when a category is selected.

When enabled, breadcrumbs help buyers:

  • understand where they are in the category structure
  • move back to a parent category without restarting from the full catalog
  • use the breadcrumb home action to return to the configured catalog page

The breadcrumb home action should return buyers to the page named in Default Product Page. If no value is set, the component falls back to Commerce_Catalog.

OrderCentral improves the reliability of this existing navigation path. The configuration does not add a new breadcrumb setting. Instead, it makes the existing breadcrumb-home return behavior safer to validate and depend on during storefront setup.

Validate category navigation on the live storefront

After you save and publish the page, validate both the browsing path and the return path.

Validation path 1: Preselected main category with Level 2 browsing

  1. Open the storefront page where the component is configured.
  2. Set Main Category to a top-level category that has subcategories.
  3. Set Display Category to Level 2.
  4. Publish the page and open it as a buyer.
  5. Confirm the page opens inside the selected main category.
  6. Confirm the selected main category's Level 2 subcategories are visible.
  7. Select a subcategory and confirm the product list updates for that category.
  8. If Enable product filtering is enabled, confirm filtering still works without removing the expected category context.

If Level 2 options do not appear, recheck that the selected Main Category actually has subcategories and that the page was published after the setting change.

Validation path 2: Breadcrumb-home navigation

  1. Set Display bread crumbs to enabled.
  2. Set Default Product Page to the named page buyers should return to.
  3. Publish the page and open a category or subcategory as a buyer.
  4. Confirm the breadcrumb path appears above the category menu.
  5. Select the breadcrumb home action.
  6. Confirm the buyer returns to the named page from Default Product Page.
  7. Confirm the category selection is cleared and the buyer is back at the expected catalog starting point.

If Default Product Page is left blank, confirm the return destination behaves as Commerce_Catalog.

Troubleshoot common setup issues

Buyers do not see subcategories after a main category is preselected

Check both settings together:

  • Main Category should point to a category that contains subcategories.
  • Display Category should be set to Level 2.

If Display Category is Level 1, buyers will not see subcategories from the category menu.

Breadcrumb home returns to the wrong page

Review Default Product Page in the component properties.

If it is blank, the component uses Commerce_Catalog. Set the property explicitly when your storefront uses a different named page for catalog return behavior.

The page looks different, but category behavior did not change

This is expected when only Direction or Display Menu Links As was updated. Those settings change presentation, not category data or breadcrumb logic.