How To Display Breadcrumb Navigation Links In WordPress?

Do you want to Display Breadcrumb Navigation Links In WordPress Website? Breadcrumb Navigation is a secondary navigation system which tells the users that they are on a website related to the homepage.

Here, In this post, we will illustrate you What is Breadcrumb Navigation and how to display breadcrumb navigation links in WordPress.

What is Breadcrumb Navigation and Why You Need it?

Breadcrumb Navigation is a word that is used to describe hierarchical navigation menus present as a trail of links. Often, it is used as secondary navigation which allows users to move up and down in the hierarchy of links.

However, the breadcrumb navigation links in WordPress are different from the default navigation menu system.

The purpose of breadcrumb navigation is to help users to navigate around the site. It helps users understand where they are on the website. Also, it helps the search engine understand the hierarchy of links on the web page.

Search engines such as Google have started showing breadcrumbs under the title of a website in search results. This gives your site more visibility in the results and increases your clicks through the rate.

Now let’s see:

How to add breadcrumb navigation links in WordPress

Adding Breadcrumb Navigation using Breadcrumb NavXT Plugin

This is the easiest way to add breadcrumb navigation to a WordPress site. It’s very flexible, easy to use, and there are more options in it that you can imagine. See why we use Breadcrumb NavXT on wpglobalsupport.

First, you have to install the Breadcrumb NavXT plugin and then activate it. After activation, you have to go to Settings»Breadcrumb NavXT page to configure plugin settings.

Default settings should work for most sites. However, you want to make changes to customize settings as per requirement.

The settings page is broken into different sections. You can define on the general settings tab, how the plugin behaves on your site globally.

This allows you to modify the breadcrumb navigation link template. Also, you will see that these link templates use Schema.org parameters in the link tag.

Under the plugin settings, the Post Type tab allows you to setup the breadcrumb link for the post, page and any custom post type.

You can select how you want to show the post hierarchy. By default the plugin will use the site Title>Category>Post title. Also, you can change your categories with dates, tags, or post parent.

There are similar templates for your breadcrumb navigation links in taxonomies and authors tab.

Press the save changes button to save your changes.

Showing Breadcrumb NavXT on Your Website

You need to edit your theme files for the plugin. You have to add this code to your theme or child theme’s header.php file where you want to display breadcrumb navigation.

<div class=”breadcrumbs” typeof=”BreadcrumbList” vocab=”http://schema.org/”>

   <?php if(function_exists(‘bcn_display’))

   {

       bcn_display();

   }?>

</div>

 

That’s all!

Now you can go to your site and see the breadcrumb navigation links by visiting any post or page.

Adding Breadcrumb Navigation Links Using Yoast SEO Plugin

The very first thing, you have to install the Yoast SEO plugin and activate it. If you are beginners, the read our guide how to install a plugin and set up Yoast SEO plugin in WordPress.

After activation, you have to head over the SEO>>Advanced page and then check the ‘Enable breadcrumbs’ option.

Once you check in, you will find many options for displaying breadcrumbs on your site. For most people the default settings should work for most folks, however feel free to change anything you like.

Once complete, then click the Save Changes button to store your settings.

Showing Yoast’s Breadcrumb Navigation on Your Site

Already few WordPress themes support Yoast’s breadcrumbs. You can go to your site and click on single posts and pages to see if your theme shows breadcrumb navigation on the page.

However, in case your theme does display breadcrumb navigation automatically, you will need to add a little code snippet to your WordPress theme.

Simply add this code to your theme or child theme’s header.php file. You should keep the code at the end of the file.

<?php if ( function_exists(‘yoast_breadcrumb’) )

{yoast_breadcrumb(‘<p id=”breadcrumbs”>’,'</p>’);} ?>

That’s all!

Now you can go to your site to see breadcrumb navigation in action.

CONCLUSION

Here, we have discussed How to Display Breadcrumb Navigation Links in WordPress.

Often, we concluded What is Breadcrumb Navigation and Why You Need it? Thus, we hope this blog will help you to display Breadcrumb Navigation Links.

However, If you have any problem with the same, then, let me know in the comments section. Infect, If you liked this post, please share it with your peers.

 

Leave a Reply

Your email address will not be published. Required fields are marked *