In Magento 2, breadcrumbs on the product page are generated dynamically based on the user’s navigation path, which allows displaying a contextual trail based on the entry category. However, this logic poses a problem: the same product can belong to multiple categories (e.g., promotions, virtual categories), making the breadcrumb variable and sometimes inconsistent for SEO or user experience.
To ensure that a product always has a single coherent breadcrumb, it’s recommended to add a custom attribute to the product to define its main category (rather than simply taking the first assigned category or a random choice). This avoids ambiguities, especially when category assignment is automated or multiple.
Warning: if the breadcrumb CSS is not adapted, dynamic loading can cause CLS (Cumulative Layout Shift), a visual shift that penalizes the Google PageSpeed score, particularly on mobile where the element is at the top of the page.
Technical solution:
- Create a new product attribute for the main category.
- Replace the breadcrumb template only on product pages, adapting the block via Magento layouts (without using preference, but by extending the block or via a view model).
- Adapt the CSS to reserve space for the breadcrumb and avoid CLS.
This change improves SEO consistency, user experience, and web performance, while respecting Magento best practices.