After doing a couple of searches for Google Rich Snippets for WordPress Breadcrumbs, I was unable to find a suitable solution that is flexible or plugin based. In this tutorial, we will be covering the implementation of Breadcrumb rich snippets with Microdata for WordPress, which many themes/plugins don't have by default (see Google Breadcrumb Rich Snippet documentation). This method will also cover rich snippets for date archive breadcrumbs and author archive breadcrumbs if you happen to need those.
We will be using Yoast's WordPress SEO Plugin to implement the breadcrumbs on your WordPress website. If you are using a theme that has breadcrumbs or a different plugin to implement these then you may want to replace the default breadcrumb script with the one from the WordPress SEO plugin (otherwise this tutorial may be difficult to follow).
Adding SEO Rich Snippets for Breadcrumbs
To begin, make sure that you have the newest WordPress SEO plugin installed. After enabling breadcrumbs and correctly implementing it to your theme:
1. Open class-breadcrumbs.php in your Plugins Folder
Via FTP, find your WordPress install and go to /wp-content/plugins/wordpress-seo/frontend/ and download class-breadcrumb.php. This will be the only file you will need to make changes to in order to have SEO Rich Snippets on your breadcrumbs.
2. Add Markup Data to the Following Lines
You will want to add the rich snippet markup data to all the outputs so that it shows up valid on breadcrumbs for tags, categories, pages and posts on the front-end.
First, open class-breadcrumbs.php and find line 122.if ( "page" == $on_front && 'post' == get_post_type() ) {
$homelink = '<a href="'.get_permalink(get_option('page_on_front')).'">'.$home.'</a>';
$bloglink = $homelink;
if ( $blog_page && ( !isset($opt['breadcrumbs-blog-remove']) || !$opt['breadcrumbs-blog-remove'] ) )
$bloglink = $homelink.' '.$sep.' <a href="'.get_permalink($blog_page).'">'.$this->get_bc_title($blog_page).'</a>';
} else {
$homelink = '<a href="'.get_bloginfo('url').'">'.$home.'</a>';
$bloglink = $homelink;
}
if ( ( $on_front == "page" && is_front_page() ) || ( $on_front == "posts" && is_home() ) ) {
$output = $this->bold_or_not($home);
} else if ( $on_front == "page" && is_home() ) {
$output = $homelink.' '.$sep.' '.$this->bold_or_not( $this->get_bc_title($blog_page) );
} else if ( is_singular() ) {
$output = $bloglink.' '.$sep.' ';
Every section has to be wrapped in itemscope itemtype="http://data-vocabulary.org/Breadcrumb" and the breadcrumb title of the page needs an itemprop="title" tag. In addition to that, every link must include the itemprop="url" tag. For this example, we will be using a div for the itemscope and a span for the titles, so the code above with the rich snippets will look like this:
if ( "page" == $on_front && 'post' == get_post_type() ) {
$homelink = '<div><a href="'.get_permalink(get_option('page_on_front')).'"><span>'.$home.'</span></a></div>';
$bloglink = $homelink;
if ( $blog_page && ( !isset($opt['breadcrumbs-blog-remove']) || !$opt['breadcrumbs-blog-remove'] ) )
$bloglink = $homelink.' '.$sep.' <div><a href="'.get_permalink($blog_page).'"><span>'.$this->get_bc_title($blog_page).'</span></a></div>';
} else {
$homelink = '<div><a href="'.get_permalink(get_option('page_on_front')).'"><span>'.$home.'</span></a></div>';
$bloglink = $homelink;
}
if ( ( $on_front == "page" && is_front_page() ) || ( $on_front == "posts" && is_home() ) ) {
$output = '<div><span>'.$this->bold_or_not($home).'</span></div>';
} else if ( $on_front == "page" && is_home() ) {
$output = $homelink.' '.$sep.' <div><span>'.$this->bold_or_not( $this->get_bc_title($blog_page) ).'</span></div>';
} else if ( is_singular() ) {
$output = $bloglink.' '.$sep.' ';
If you did the above correctly, only your 'home' or 'blog' link will be displayed with SEO rich snippets. In order for all other breadcrumbs to display, tag breadcrumbs, category breadcrumbs, date archive and author archive breadcrumbs, and of course pages and posts, you will have to find the corresponding lines and add the markup data. Here are the lines you will want to edit after the above has been implemented: 155,157,167,182,189,182,207,210,230,239,248,260,269,271,279,280,282,284,292 and 298.
Testing your WordPress Breadcrumb Rich Snippets
Now that you implemented the rich snippets (and hopefully did everything right), you may test your pages with the Rich Snippet Testing Tool by Google. Your output should look something like the image on the right:
Depending on your WordPress theme / CSS, you may have to make some changes to the CSS file to make the breadcrumbs look correct.
Said on Oct 16, 2012 by EmanueleT -
Said on Oct 16, 2012 by Maximilian Ruthe -
Said on Dec 12, 2012 by Andy -
Said on Aug 30, 2013 by Kamran -
Said on Sep 13, 2013 by Felix Arntz -