Navigation is an essential part of any WordPress website. No one likes clicking through several pages to find what they need. So, you want to make it effortless for visitors to locate specific content on your website.

Thanks to breadcrumbs (not the edible ones), you can provide your visitors with an easy way to find their way around your website. If you don’t have breadcrumbs enabled yet, keep reading to learn how to set it up. 

Check out this example from Best Buy below. If visitors enter their site at PC Laptops, they can see other related categories at the top of the page, like Computers & Tablets or Laptops.

WordPress breadcrumbs example on Best Buy website

Source: Best Buy

With breadcrumbs, visitors get one-click access to related pages on your website, which is a critical factor in maintaining the attention of your potential customers.

Why Add Breadcrumbs to Your WordPress Website

Breadcrumbs do more than just enhance the visitor experience. They also help search engines crawl your website to figure out its internal linking structure. Sometimes, Google uses your breadcrumbs in search results to help your visitors—making your SEO efforts more effective.

WordPress breadcrumbs example on Google

Source: Google

Breadcrumbs also can help with lowering bounce rates. Because visitors can access your website from any page, breadcrumbs act as a guide for visitors to explore other parts of your website. 

How to Add Breadcrumbs to WordPress

There are a couple of options for adding breadcrumbs. We’ll review how to add breadcrumbs with themes and plugins. Choose whichever method works best for your WordPress website.

How to Add Breadcrumbs to WordPress With Themes

Good news, most of the latest WordPress themes have breadcrumb navigation enabled. So, you don’t have to do anything extra to add breadcrumbs to your WordPress website. Here are a few themes with this built-in feature:

  • Page Builder Framework: This theme makes it possible to customize your breadcrumbs.
  • Knowledge Base: This theme navigates visitors through breadcrumbs within your customer support knowledge base.
  • Astra: This theme lets you place breadcrumbs anywhere on a page.
  • Shopkeeper: This theme allows you to enable breadcrumbs on your online store.
  • WooThemes: This is a collection of WooCommerce themes with breadcrumb capabilities.

How to Add Breadcrumbs to WordPress With Plugins

If your theme doesn't support breadcrumb navigation, you can install these WordPress plugins to add breadcrumbs to your website.

1. Yoast SEO

Yoast SEO is one of the most popular WordPress plugins. Among its many benefits is the ability to add breadcrumb navigation to your website. To get started, follow these steps.

  • Install and activate the plugin.
  • Go to Appearance > Theme Editor.
  • Under Theme Files, add the code below in the single.php or page.php files, above the title of the page. 

 

<?php

if ( function_exists('yoast_breadcrumb') ) {

  yoast_breadcrumb( '</p><p id="breadcrumbs">','</p><p>' );

}

?>

  • Next, click SEO > Search Appearance.
  • Go to the Breadcrumbs tab.
  • Select Enable.
  • Configure the settings to your preferences.

Setting up WordPress breadcrumbs in Yoast SEO plugin

  • Click Save changes.

This plugin’s advanced settings give you control of the breadcrumb structure. Learn how to edit your breadcrumb pathway here.

2. Breadcrumb NavXT

Breadcrumb NavXT is the go-to plugin for breadcrumb trails. It also offers extensive control to customize your breadcrumbs.

  • Install and activate the plugin.
  • Go to Settings > Breadcrumb NavXT.

Setting up WordPress breadcrumbs in Breadcrumb NavXT pluginSource: WordPress

The default settings are enabled and can work for most WordPress websites. It will display the post hierarchy like this: Site Title > Category > Post Title.

If you want to make changes, you can tailor the settings to fit your needs. Under the General tab, you can define how the breadcrumbs will work on your entire site. The Post Types tab allows you to personalize the breadcrumbs for your posts and pages.

3. Breadcrumb

Breadcrumb is a lightweight WordPress plugin that displays breadcrumb navigation anywhere on your website using shortcodes. A shortcode is WordPress-specific code, allowing you to embed objects into your page without the normal, complicated coding. Think of it as a shortcut. 

  • Install and activate the plugin.
  • Go to Breadcrumb on the left side of the admin dashboard. (You may have to scroll down.)
  • Configure the settings to your preferences.

Setting up WordPress breadcrumbs in Breadcrumb pluginSource: WordPress

  • Click Save Changes.
  • Now, go to a new or existing page or post in your WordPress editor and add this shortcode: [breadcrumb]
  • Your breadcrumb will appear like this: 

WordPress breadcrumbs example in Breadcrumb pluginSource: WordPress

4. Catch Breadcrumb

Catch Breadcrumb is a simple tool to create seamless breadcrumb navigation. Unlike some plugins, you have the option not to display the breadcrumbs on the homepage of your website.

  • Install and activate the plugin.
  • Go to Catch Breadcrumb on the left side of the admin dashboard. (You may have to scroll down.)
  • Under the Dashboard tab, configure settings to your preferences.

Setting up WordPress breadcrumbs in Catch Breadcrumb pluginSource: WordPress

  • Click Save Changes.
  • Add this shortcode in your WordPress Visual editor (where you normally insert content): [catch-breadcrumb] 

5. Flexy Breadcrumb

Flexy Breadcrumb has rave reviews for its easy implementation. It’s another plugin that uses a shortcode to add breadcrumbs to your website.

  • Install and activate the plugin.
  • Go to Flexy Breadcrumb on the left side of the admin dashboard. (You may have to scroll down.)
  • Configure the settings to your preferences.

    Setting up WordPress breadcrumbs in Flexy Breadcrumb plugin
  • Click Save Changes.
  • Add this shortcode in your WordPress Visual editor (where you normally insert content): [flexy_breadcrumb]

6. SEOPress

SEOPress is a comprehensive SEO plugin to optimize your website. Ranked as a top-rated tool, this plugin offers breadcrumbs at as a premium feature in its Pro version.

  • Install and activate the plugin.
  • Go to SEO, then the Breadcrumbs tab.
  • Underneath Configure your breadcrumbs, toggle the feature on. (It should become green.)
  • Click Save Changes.
  • Go to Appearance >Theme Editor.
  • Under Theme Files, click the header.php file.
  • Add the code below to the end of the file.

 

if(function_exists("seopress_display_breadcrumbs")) { 

seopress_display_breadcrumbs(); }

  • Click Update File to save your changes.

To learn how to customize your breadcrumbs, check out this four-minute YouTube video.

7. WordPress SEO Plugin – Rank Math

Rank Math is a plugin dedicated to helping its users rank higher in search engines. They also provide industry-leading support if you get stuck.

  • Install and activate the plugin.
  • Complete the six-step Setup Wizard.
  • Go to Rank Math on the left side of the admin dashboard. (You may have to scroll down.)
  • Under the Breadcrumbs tab, click On next to Enable breadcrumbs function.

Enabling WordPress breadcrumbs in Rank Math pluginSource: Rank Math

  • Configure the settings to your preferences.

Setting up WordPress breadcrumbs in Rank Math pluginSource: Rank Math

  • Click Save Changes.

Follow these instructions to turn off breadcrumbs in WordPress:

  • Go to your admin dashboard.
  • Go to Appearance > Theme Editor.
  • Under Theme Files, click the file where you added the breadcrumbs. For example, single.php for blog posts, index.php for the main page, or page.php for pages.
  • Use Ctrl + F (or Command F on Macs) to open your browser's search function. Search for breadcrumb to locate the PHP code. 
  • Add two forward slashes (//) in front of this line of code. This temporarily disables the code.
  • Click on Update File to save your changes.

Breadcrumbs are beneficial to help your visitors navigate your WordPress website. And the SEO boost is an added bonus. Want to learn more? Check out this blog post: 9 Breadcrumb Tips and Examples to Make Your Site Way Easier to Navigate.

Wordpress Plugin HubSpot

Originally published Sep 11, 2019 3:08:20 PM, updated September 11 2019

Topics:

WordPress Website