How to Add Breadcrumb Navigation in Blog Posts – Google Supported

Breadcrumb Navigation

In this post we will learn how to add breadcrumb navigation in blog posts. That breadcrumb navigation will be Google supported. It means your breadcrumb navigation will be visible in Google search results. We will learn adding breadcrumb navigation in WordPress and Blogger both.

What is Breadcrumb Navigation?

Navigation
Navigation

Breadcrumb Navigation is a navigation system which display site path. In other words breadcrumb navigation show some “jump to” options where you can jump from current page to its category page or main page. When we add breadcrumb navigation in blog posts it shows that the post belongs to which category and which is site’s main or index page.

Breadcrumb Navigation in Blog Posts

We will see here how breadcrumb navigation works and display.

Breadcrumb Navigation in Blog Posts

You can see in the image. The post is “Biggest List of Do Follow Blog Directories” where I have given a biggest list of Do Follow Blog Directories. The do follow blog directories is a SEO term. So I put this post in SEO category. That is why the breadcrumb navigation is showing Home page then SEO Category then post name (post breadcrumb).

So now we know that the breadcrumb navigation show root directory of website and particular category decided by us then the post tile.

Note: Only primary category will display in Breadcrumb.

Breadcrumb Navigation in Google Search Results

Breadcrumb Navigation in Google Search Results

You can see in the image how breadcrumb navigation display in Google search results. Breadcrumb Navigation is a schema property or you can say a structured data type which is readable by Google. When ever Google fetch and render a website. It read all structured data types and try to display them in Google search results as rich snippet. All structured data types are not visible but they make it easy to understand your website. Two main structured data types that I love are Breadcrumb Navigation and Ratings.

How to Add Breadcrumb Navigation in WordPress

I only use Yoast SEO plugin to add Breadcrumb Navigation in WordPress. That is easy and takes just few steps to setup breadcrumb navigation in WordPress posts. There are many other plugins and themes which provide breadcrumb navigation but the best and Google supported breadcrumb navigation are provided by Yoast SEO plugin.

Yoast SEO Plugin
Yoast SEO Plugin

How to Add Breadcrumb Navigation in Blogger

  1. Go to Theme.
  2. Click Edit HTML.
  3. Search this code.
    <b:includable id='post' var='post'>

    by pressing Ctrl+F.

  4. Replace the above code with the following code.
<b:includable id='post' var='post'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'>
<div class='jekeshBreadCrumbs'>
<a expr:href='data:blog.homepageUrl' itemprop='url' title='Home'>
<span itemprop='title'>Home</span></a>&#187;
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<span typeof='v:breadcrumb'>
<a expr:href='data:label.url' itemprop='url' title='Categories' property='v:title' rel='v:url'>
<span itemprop='title'><data:label.name/></span>
</a>
</span>
<b:if cond='data:label.isLast != &quot;true&quot;'>|
</b:if>
</b:loop>
</b:if>
&#187;
<a expr:href='data:post.url' itemprop='url' title='Post Title'>
<span itemprop='title'>
<data:post.title/>
</span>
</a>
</div>
</div>
</b:if>

Breadcrumb Navigation is added in Blogger now.

Now reload your blogger blog and open any post. You will see breadcrumb navigation.

Then go to Google’s Structured Data Testing Tool and check. is your breadcrumb navigation working fine or not.

Now go to Google Webmaster Tools and fetch and render your blog for crawling new structured data (breadcrumb navigation) from your blog.

Learn more about breadcrumb navigation at:

  1. Google
  2. WPBeginner

More from jekesh kumar oad:

  1. robots.txt

How to Add Breadcrumb Navigation in Blog Posts – Google Supported
5 (100%) 3 votes

Popular on Jekesh Kumar Oad Right Now!

1 Comment

  1. Thanks for taking the time and writing this post.The simplest language you use when writing articles is appreciated.The estimate of writing your site post is very good.The information you give will prove to be of great value to me,I hope that. It is our wish that you continue to write great articles in such a future.Thanks for sharing this article. Thank you

Leave a Reply

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