As with all things WooCommerce you can remove WooCommerce breadcrumbs in a few different ways. We specialise in providing answers that DON’T require you to custom code your WooCommerce store.

That being said, we do provide some code based solutions to demonstrate the alternative (wrong) way to hide WooCommerce Breadcrumbs (in our opinion).

I’ll briefly also mention using WordPress and how to turn off breadcrumbs in WordPress more generally.

WooCommerce Remove Breadcrumbs From Product Page

Table of Contents

This article contains affiliate links which means we may earn a small commission if you purchase plugins and services we mention at no extra cost to you. We only recommend the best plugins and services – which we have used and can recommend.

Remove WooCommerce Breadcrumbs with Custom CSS

The simplest, and probably the easiest way to disable WooCommerce Breadcrumbs is by entering some CSS code into the Additional CSS section of the WooCommerce Theme Customizer.

How to Remove WooCommerce Breadcrumbs on desktop AND mobile

Enter the following CSS Code into the Additional CSS Section of the WooCommerce Theme Customizer

/*Remove Breadcrumbs on Desktop and Mobile*/ .woocommerce-breadcrumb { display: none; }

How to Remove WooCommerce Breadcrumbs on Mobile only

/*Remove Breadcrumbs on Mobile*/ @media (max-width: 980px){ .woocommerce-breadcrumb { display: none; }}

How to Remove WooCommerce Breadcrumbs on Desktop Only

/*Remove Breadcrumbs on Desktop*/ @media (min-width: 981px){ .woocommerce-breadcrumb { display: none; }}

How to Remove WooCommerce Breadcrumbs with a Page Builder

You can build an entire new product page using a page builder without using a single line of code.

You don’t have to build anything fancy – you can in fact just build an almost exact copy of the default WooCommerce Product page and tweak the design to your requirements.

So in this example, you can simply “switch to page builder” on the product page and build the page WITHOUT WooCommerce Breadcrumbs.

You’re not hiding WooCommerce Breadcrumbs

You’re not disabling WooCommerce Breadcrumbs

You’re removing WooCommerce Breadcrumbs from the Product Page altogether.

This is, as far as we’re concerned the right answer from a technical standpoint and a much more sustainable and attainable answer for WooCommerce users who aren’t developers.

YOU DON’T need to be a developer to create and run a WooCommerce store – custom code solutions are damaging ways of creating poorly performing WooCommerce stores that are hacked together with “customisations”.

Use a page builder like Divi – which you can check out here – Read More About the Divi Theme and Page Builder all in one.

WordPress turn off breadcrumbs

If your WordPress theme has breadcrumbs built into it, you’ll need to consult your theme developer on exactly how to switch off the breacrumbs.

If you’re using a decent WordPress theme you’ll more than likely find a tick box or radio button under “Theme Options” or in the WordPress “Theme Customizer” to disable breadcrumbs in WordPress.

Remember, you can choose to hide WordPress Breadcrumbs using custom CSS, but this approach is typically a “work around” – as you can end up with lots of CSS designed to hide elements on the page, which can build up over time! These don’t help with site speed, so it’s best to use the Theme Options where possible.

How To Remove WooCommerce Breadcrumbs From Woo Product Page