Skip to content

How to Add Breadcrumbs to any WordPress Website- 2022

There are many ways to display breadcrumbs on WP Websites. To add these to any WordPress website you need to make sure your theme has the default support option, use the plugin, have this option in the SEO plugin, or you can add coding.

Benefits of Using Breadcrumbs in WordPress:

Enabling it on your WordPress website makes it easier for the user to navigate to the homepage, archive page, or post on your website. It also serves as a positive signal for SEO.

Precautions before enabling:

There are 2 things you need to know carefully before displaying it on your site. 1. Select an SEO-friendly theme. 2. Choose either a theme option or a plugin option. Both should not be selected at the same time.

Using Rank Math SEO Plugin:

If your theme does not have a breadcrumb option, you can easily enable it if you are using the ranking SEO plugin.

Navigate to WordPress “Dashboard” and hover over the “Rank Math”, then select “General Settings”.

General Settings of Rank Math
General Settings of Rank Math

In the Rank Math SEO settings, click “Breadcrumbs” and enable its function, then customize the settings, and then click “Save changes”.

Enabling Breadcrumb Function using Rank Math SEO Plugin
Enabling Breadcrumb Function using Rank Math SEO Plugin

Now hover over the “Appearance” and click “Theme editor”.

Theme Editor
Theme Editor

To show it across your website. Place the code which is given below the screenshot (If you didn’t copy as explained above) and paste it into the ”header.php” and click update.

Add Breadcrumb Code to Theme Files
Add Breadcrumb Code to Theme Files
<?php if (function_exists('rank_math_the_breadcrumbs')) rank_math_the_breadcrumbs(); ?>

If you want to add it to the pages and posts, place the above code (If you didn’t copy as explained above) in the “page.php” and update it.

If you want to show it only in the posts, place the above code (If you didn’t copy as explained above) in the “single.php” and update it.

Or, copy the following code and paste it into any page, post, or anywhere on your website.

[rank_math_breadcrumb]

Using Yoast SEO Plugin:

Add Breadcrumbs using Yoast SEO Plugin
Add Breadcrumbs using Yoast SEO Plugin

With Yoast SEO you can even add it to just a single page and post. It is possible to do with the block. To do that, add a block to your post or page. These will only appear on the personal page where you added the block. If you want to add it to the website you have to follow them as explained in the Rank Math SEO.

How to Navigate to Yoast SEO Settings:

After navigating to the WordPress dashboard, hover over to the “Yoast” and select “Search Appearance”.

Navigating to Yoast SEO Plugin
Navigating to Yoast SEO Plugin

Then click the “Breadcrumbs” tab and customize the settings as per your wish or keep it as it is.

Yoast SEO Breadcrumb Settings
Yoast SEO Breadcrumb Settings

Yoast SEO breadcrumb Settings.

Place the following code to your theme as explained in the Rank Math SEO plugin.

<?php
if ( function_exists('yoast_breadcrumb') ) {
  yoast_breadcrumb( '<p id="breadcrumbs">','</p>' );
}
?>

Using “Flexy Breadcrumbs Plugin”:

It is one of the simplest and most powerful plugins for WordPress navigation, developed by an author named Press Tigers. By using this plugin, you can navigate through the shortcode anywhere on your website. With the help of this plugin, you can customize text styles, formats, and formats to your liking.

Flexy Breadcrumb
Enable Breadcrumbs using Flexy Breadcrumb

You can add the following code in the header.php of your theme editor as explained in the Rank Math Plugin. It also works if you add it anywhere in your theme.

 <?php echo do_shortcode( '[flexy_breadcrumb]'); ?> 

Plugin Features:

It supports an SEO Friendly breadcrumb to your site.

It allows users to change different breadcrumb separators.

Easily change words and/or characters for the navigation menu.

You can also set the Home and End text.

The set font size of the breadcrumb trail.

Change the icon picker for the Home menu.

Different colour options for link, text, separator and background.

You can also add breadcrumbs using the [flexy_breadcrumb] shortcode.

Using “Breadcrumb NavXT WP Plugin”:

Breadcrumb NavXT
Breadcrumb NavXT

The Breadcrumb NavXT plugin generates native breadcrumb trails for a blog or website. These breadcrumb trails are customizable to any current website or blog in WordPress. Apart from that, it makes the administrative interface setting much more accessible.

What is required to enable Breadcrumbs in WordPress?

To add it to any WordPress website you need to make sure your theme has the default support option, use the plugin, or have this option in the SEO plugin, or you can add coding.

What are the benefits of using Breadcrumbs in WP?

Enabling it on your WordPress website makes it easier for the user to navigate to the homepage, archive page, or post on your website.

What are the Precautions before enabling Breadcrumbs?

1. Select an SEO-friendly theme. 2. Choose either a theme option or a plugin option. Both should not be selected at the same time.

Share