Blog

Add Breadcrumb Links to your Blog’s SERP Snippet – A Quick Guide

Rich snippets within the search results can help to increase click-through rates and also make users aware of other content from your website. We have heard loads over the past year or so about Google+ authorship within your search engine snippet, but one extra feature that I rarely hear mentioned is the use of breadcrumb navigation links.

In the image above you can see an article that I recently wrote appear in the SERPs. I have highlighted the breadcrumb link that goes to the Technical SEO category section of the Wow Internet blog. This can be really handy toward getting more of your content in front of users and also makes for a better user experience in general. To actually implement this into your SERP snippet couldn’t be easier!

Adding Breadcrumb Link Code to Your Blog

There are a few different mark-up languages that allow you to link up your website breadcrumb links to your search engine snippet. In this example I am going to use RFDa code. Don’t worry if you’re not particularly code-savvy because I have also made a quick video for WordPress users so that you don’t need to get your hands dirty with the technical stuff!

Like you will see at the top of this page, there are some breadcrumb links that show the article is within the ‘SEO Articles’ top-level category and it has been filed under the ‘Technical SEO Articles’ child category. Below is the code used for these breadcrumb links:

<p id="breadcrumbs">
<span xmlns:v="http://rdf.data-vocabulary.org/#">
<span typeof="v:Breadcrumb">
<a href="http://www.wowinternet.co.uk/blog" rel="v:url" property="v:title">Blog Home</a>
</span> 
> 
<span typeof="v:Breadcrumb">
<a href="http://www.wowinternet.co.uk/blog/category/seo/" rel="v:url" property="v:title">SEO Articles</a>
</span>
> 
<span typeof="v:Breadcrumb">
<a href="http://www.wowinternet.co.uk/blog/category/seo/technical-seo/" rel="v:url" property="v:title">Technical SEO Articles</a>
</span> 
> 
<span typeof="v:Breadcrumb">
<span class="breadcrumb_last" property="v:title">SERP Rank Tracking Tools and Expert Opinions</span>
</span>
</span>
</p>

The typeof=”v:Breadcrumb” tag lets the search engines know that the data you are marking up is a breadcrumb, then by using the property=”v:title” attribute you are able to label the title of the breadcrumb (for example, ‘Technical SEO Articles’). Finally, the rel=”v:url” links the actual URL of the breadcrumb category page to the breadcrumb title.

If you want a bit more information on RDFa code then give this Google Webmaster help article a quick read. For more information and examples of breadcrumb code, take a look at this Bing Webmaster help article.

Adding Breadcrumbs to your WordPress Blog – The Easy Way

If you don’t fancy trying to figure out how to make this code fit for your website, take a look at this 5 minute video I have made that shows you how to do this within WordPress with a minimal amount of interaction with technical code.

[youtube]http://www.youtube.com/watch?v=qoMjPrnZqkU[/youtube]

Seem easy enough? Then get it sorted out on your blog now!