Breadcrumbs in WordPress are those little navigation links at the top of your page, showing a trail of links from the homepage to the current page. While breadcrumbs can help visitors find their way around, you may want to remove breadcrumbs for a cleaner look on your website. However, breadcrumbs are also crucial from an SEO perspective. They help your most profound pages appear more efficiently, allowing customers to navigate and find pages easily. SEO experts generally recommend using breadcrumbs on your website.
In this article, we will help you remove breadcrumbs from WordPress.
What are Breadcrumbs?
Breadcrumbs are navigational links that help users understand their location within your website. Visitors can click on the link to return to the homepage. Sometimes, it’s useful too. They typically look something like this:
Home > Category > Subcategory > Current Page
While useful for navigation, they may only sometimes fit your site’s design or preferences. Removing them is pretty simple with the following tips.
Three Easy Methods to Remove Breadcrumbs
Method 1: Disable Breadcrumbs from a Plugin
If you’re using a plugin to generate breadcrumbs, deactivating it is the quickest way to remove them. Most plugins come with breadcrumbs, which require setup. First, find the source of the plugin that has breadcrumbs. Secondly, turn off breadcrumbs if possible.
- Go to your WordPress Dashboard.
- Navigate to the ‘Plugins’ menu.
- Find the breadcrumb plugin in the list.
- Click ‘Deactivate’.
That’s it! Your breadcrumbs should be gone.
Method 2: Remove Breadcrumbs from the Theme Code
Sometimes, breadcrumbs are part of your theme’s code. In this case, you need to tweak your theme editor. However, the best advice would be to use a child theme to access the CSS editor. Here’s how you can remove them:
- Access the Theme Editor:
- Go to your WordPress Dashboard.
- Navigate to ‘Appearance’> ‘Theme File Editor’.
- Find the Breadcrumb Code:
- Look for the header.php or another template file where breadcrumbs might be coded.
- Contact your theme developer for guidance if you need help finding where to look.
- Remove or Comment Out the Breadcrumb Code:
- Locate the line of code responsible for breadcrumbs.
- Remove it or comment it out by adding <!– before the code and –> after the code.
Method 3: Use Custom CSS
If you’re uncomfortable editing theme files or deactivating plugins, you can hide breadcrumbs using custom CSS. It would be best if you had more practice here because first, you need to find the source code location, and then you can remove it.
1. Open Custom CSS Section:
- Go to your WordPress Dashboard.
- Navigate to ‘Appearance’> ‘Customize’.
- Click on ‘Additional CSS.’
2. Find the Breadcrumb CSS Class:
- Open your browser’s Developer Tools:
- On Windows, press F12.
- On Mac, press Command + Option + J.
- Inspect the breadcrumbs in the ‘Elements’ tab to find the CSS class.
3. Add Custom CSS:
- In the ‘Additional CSS’ section, add the following code (replace .breadcrumbs with the actual class name if different):
.breadcrumbs {
display: none;
}
4. Publish the Changes:
- Click ‘Publish’ to save your changes.
Wrapping Up
Removing breadcrumbs from your WordPress site can be done in a few simple steps, whether through deactivating a plugin, editing theme files, or adding custom CSS. Choose the method that you’re most comfortable with, and you’ll have a breadcrumb-free website in no time! However, ensure that you don’t need a breadcrumbs schema. When you remove the breadcrumbs, the new page index will also remove the schema from search results.
If you have any specific issues or need further customization, don’t hesitate to contact your theme developer or consult the WordPress support forums.
