Magento 2 by default supports breadcrumbs in categories, products, and CMS pages. In this article, we will describe breadcrumbs types, SEO benefits, how to show/remove breadcrumbs to categories, products, CMS, and other pages in Magento 2.

What Are Breadcrumbs?

Breadcrumbs are links that generally display after the main/top menu navigation of the page. It allows visitors to track where they are on the site and how far they are from the homepage.

What Are The Types of Breadcrumbs That Exist?

There are three common types of Breadcrumbs: History-Based Breadcrumbs, Hierarchy-Based Breadcrumbs, and Attribute-Based Breadcrumbs.

History-Based Breadcrumbs display to visitors, the other pages they have visited on the website, similar to browser history. For example, if visitors were searching for Magento news and read three different articles, the breadcrumbs might look like this: Home > Magento article 1 > Magento article 2 > Current page

Hierarchy-Based Breadcrumbs are also known as Location-Based Breadcrumbs. It's the most common type of breadcrumbs that informs visitors where they are in the site structure and how to get back to the previous or homepage.  For example: Home > CategoryA > SubCategoryA

Attribute-Based Breadcrumbs are commonly used on e-commerce websites/stores to display what attributes visitors have clicked. For example Home > CategoryA > SubCategoryA > ProductA

What Are The Benefits of Using Breadcrumbs for SEO?

Breadcrumbs are important for SEO. It helps search engines like Google to better understand the site hierarchy. Breadcrumbs can improve the user experience (UX) of your site, keep visitors longer on the website, improve your site ranking in search engines, and more.

How to Show/Remove Breadcrumbs For All CMS Pages In Magento 2?

1. Log in to the admin panel, and go to Stores > Settings > Configuration.

2. Expand General and click on the Web tab

3. Open Default Pages section, and set Show Breadcrumbs for CMS Pages to Yes

4. click Save Config and flush caches

The breadcrumbs will show to all CMS pages in the storefront.

To disable breadcrumbs to all CMS pages in Magento 2, repeat the same steps and change Show Breadcrumbs for CMS Pages field to No.  Make sure to click Save Config and flush caches.

The breadcrumbs will be removed from all CMS pages in the storefront.

How to Show/Remove Breadcrumbs For All Categories & Products Pages In Magento 2?

By default in Magento 2, breadcrumbs are showing in categories and products pages. There are no settings in the admin panel to disable breadcrumbs to all categories and product pages.

If you would like to remove/disable breadcrumbs to all your categories and products pages, you can handle it via XML layout.

For Categories

• go to your app/design/frontend/Vendor/Theme/Magento_Catalog/layout/catalog_category_view.xml file
• add this code: <referenceBlock name="breadcrumbs" remove="true" />

Breadcrumbs will be removed to all your categories pages

For Products

• go to your app/design/frontend/Vendor/Theme/Magento_Catalog/layout/catalog_product_view.xml file
• add this <referenceBlock name="breadcrumbs" remove="true" />

Breadcrumbs will be removed from all your product pages

How to Disable/Remove Breadcrumbs For a Specific CMS, Category, Product Pages in Magento 2?

Unfortunately, Magento 2 by default does not offer settings to disable breadcrumb per specific CMS, category, and products pages.

If you're looking to remove/disable breadcrumbs for a specific CMS, Category, Product page in your Magento 2 site, you will need to handle it via XML layout.

Magento 2.3.3 Version and Below

If you're using Magento 2.3.3 version and below, it's possible to remove breadcrumb in the backend under the "Layout Update XML" field on each page.

For CMS Pages

• log in to your Magento 2 Admin Panel
• go to Content > Pages
• select your CMS page from the grid
• at the CMS edit page, expand to the Design section
• set Layout to your preferred layout
• in the Layout Update XML field, enter the code below

<referenceContainer name="page.top">
    <referenceBlock name="breadcrumbs" remove="true" />
</referenceContainer>

• flush your cache

The breadcrumb will be removed to the specific CMS page in the frontend.

For Categories Pages

• Log into your Magento 2 Admin Panel
• go to CATALOG > Catalog > Categories
• select your category page, and expand to the Design section
• set Layout to your preferred layout
• in the Layout Update XML field, enter this code below

<referenceContainer name="page.top">
    <referenceBlock name="breadcrumbs" remove="true" />
</referenceContainer>

• flush your cache

The breadcrumbs will be removed to the specific category page.

For Products Pages

• Log into your Magento 2 Admin Panel
• go to CATALOG > Catalog > Product
• select your product from the grid,
• at the product edit page, expand to the Design section
• set "Layout" to your preferred layout
• in the "Layout Update XML" field, enter this code : <referenceBlock name="breadcrumbs" remove="true" />
• flush your cache

The breadcrumbs will be removed from the specific product page in the storefront.

Magento 2.3.4 Version and Above

Starting from Magento 2.3.4, the "Layout Update XML" field on the CMS, Category, and Products edit pages has been removed. This removal was made to remove the opportunity for Remote Code Execution (RCE).

It's no longer possible to add an XML code directly on each edit page in the backend. Instead, you will need to create your custom .xml file for the layout update and add it to your Magento 2 root directory, under your theme.

Follows the steps below to remove/disable breadcrumbs for a specific CMS, Category, Product page in Magento 2.3.4 version and above:

For CMS Pages

1. Go to your app/design/frontend/<VendorName>/<ThemeName>/Magento_Cms/layout/ folder

2. Add cms_page_view_selectable_<CMS Page Identifier>_<Layout Update Name>.xml

• <CMS Page Identifier> is the desired page’s URL Key with “/” symbols replaced with “_” 
• <Layout Update Name> is what will display in "Custom Layout Update" field of Design section on CMS Edit page. Eg. a layout update for an “About Us” page will be “cms_page_view_selectable_about-us_AboutUs.xml”.

3. In this cms_page_view_selectable_<CMS Page Identifier>_<Layout Update Name>.xml file, add the code below

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
     <body>
        <referenceBlock name="breadcrumbs" remove="true"/>
     </body>
</page> ​

4. Flush your cache

5.  In the admin panel,  go to Content > Pages. Choose your CMS page, open to the Design section, set "Custom Layout Update" to your custom created layout update

6. Click Save and flush your cache

The breadcrumbs will be removed from the specific CMS page.

For Categories Pages

1. Go to your app/design/frontend/<VendorName>/<ThemeName>/Magento_Catalog/layout/ folder

2. Add a catalog_category_view_selectable_<Category ID>_<Layout Update Name>.xml file where:

• <Category ID> is the specific category ID for the page you'd like to remove the breadcrumbs
• <Layout Update Name> is what will display in the Custom Layout Update field, under Design section (Category Edit page)

3. In catalog_category_view_selectable_<Category ID>_<Layout Update Name>.xml file, add the code below

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
     <body>
        <referenceBlock name="breadcrumbs" remove="true"/>
     </body>
</page> ​

4. Flush your cache

5. In the backend, go to CATALOG > Catalog > Categories. Select your category page, expand to the Design section, set "Custom Layout Update" to your custom created layout update

6. Click Save and flush your cache

The breadcrumbs will be removed from the specific category page.

For Products Pages

1. Go to your app/design/frontend/<VendorName>/<ThemeName>/Magento_Catalog/layout/ folder

2. Create a catalog_product_view_selectable_<Product SKU>_<Layout Update Name>.xml file

• <Product SKU> is the desired product’s SKU encoded as a URI.  example: “My Test SKU” -> “My%20Test%20SKU”)
• <Layout Update Name> is what will display in "Custom Layout Update" field of Design section on the Product Edit page (in the admin panel)

3. In catalog_product_view_selectable_<Product SKU>_<Layout Update Name>.xml file, add the code below

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
     <body>
        <referenceBlock name="breadcrumbs" remove="true"/>
     </body>
</page> ​

4. Flush your cache

5. In the backend, go to CATALOG > Catalog > Product. Select the product from the grid

6. Expand the Design section, set "Custom Layout Update" to your custom created layout update

7. Click Save and flush your cache

The breadcrumbs will be removed from the specific product page.

How to Show/Add Breadcrumbs to Additional/Customs Pages in Magento 2?

Magento 2 by default show breadcrumbs to CMS, categories, and products page only. If you would like to add breadcrumbs to your customer account pages (eg. confirmation, set password, edit information, review index, review view, billing agreement, edit book address, view book address, downloadable, sales order history, sales order view, store payment method, and newsletter subscription pages), contact us page, compare product pages, wishlist index pages, wishlist share pages, checkout pages (eg. shopping cart, checkout index, and checkout success pages), you can try this Magento 2 Advanced Breadcrumbs Extension

On top of adding breadcrumbs to the pages that Magento 2 does not by default, the extension allows you to use the longest/full or shortest possible breadcrumbs path to the product page. Support breadcrumbs structured data markup to the product page, to show rich snippets for breadcrumbs in search results. You can prioritize categories path to includes in breadcrumbs for products that are assigned to several categories

The extension is easy to use and comes with more features included. Feel free to check the Magento 2 Advanced Breadcrumbs Extension page for more details.

If you would like to add breadcrumbs to any additional/customs pages that are not supported by Magento 2 Advanced Breadcrumbs Extension, it's recommended to hire a professional Magento 2 developer to handle it for you. This will make sure that any changes added do not impact your site negatively.

You may need to add rich snippets (structured data) breadcrumbs to some of your pages, ensuring search engines better index the existing breadcrumbs, this can be handled by a professional Magento 2 developer as well.

Conclusion

We hope you find this article about Magento 2 breadcrumbs helpful. Feel free to share this article or leave a comment below. Your opinion is much appreciated!