Add Structured Data mark up in Blogger for Rich Search ResultsAdd schema.org structured data mark up on your blogger blogs contents using HTML5 microdata to help search engines to understand data on your webpage.
The first key behind the success of any website or blog is getting more traffics driven by the search engines i.e. from organic results. Thus, if webpage contents of your blog or website is not appearing on search results then you will lose almost all valuable readers.
Did you know? Search engines do not recognize the whole matters what is being discussed on any webpage. Therefore, you should represent your blog contents in such a manner that help search engines to understand your blog posts very well.
Accordingly, today we will learn to add structured data mark up in Blogger for rich search results. There are two different ways to mark up your blog posts using the schema.org vocabulary viz. Microdata (introduced with HTML5) and JSON-LD.
But, we will go for the first one i.e. Schema.org microdata as because it strikes a balance between the extensibility of RDFa and the ease of microformats and that can be understood by the major search engines e.g. Google, Microsoft and Yahoo to create rich snippets in search results.
How to add structured data to your blogger blog posts
First of all test your blog contents rich snippets using Google Structured Data Testing Tool and see that whether your blog is already using structured data for blog articles i.e. Item type: http://schema.org/article.
Login to your blogger account and go to the dashboard of any particular blog in which you want to add structured data.
Navigate template section of your blog and click on Edit HTML text link which permits you to view, modify and add additional HTML codes to your blogger blog.
Click anywhere in the template editor where you will see lots of codes and find the following codes.
<div class='post hentry'
Replace the above line with the following codes
<!-- Microdata markup added by Showeblogin. --> <!-- Tutorial: http://www.superwebtricks.com/?p=523 --> <div class='post hentry' itemscope='itemscope' itemtype='http://schema.org/Article'>
And add the name and url itemprop accorgingly as shown in the following codes.
<b:if cond='data:post.title'> <h1 class='post-title entry-title' itemprop='name'> <b:if cond='data:post.link'> <a expr:href='data:post.link' itemprop='url'> <data:post.title/> </a> <b:else/> <b:if cond='data:post.url'> <b:if cond='data:blog.url != data:post.url'> <a expr:href='data:post.url' itemprop='url'> <data:post.title/>
If you have added SWT snippets in your blog then you may also display it as blog post description for rich snippets to boost traffics from organic search results.
<p> <span class='swt-snippet' itemprop='description'> <data:blog.metaDescription/> </span> </p>
However, if you are using JesResKing you need not worry about any structured data as we will provide this service free of cost to you.
Note that there are various data types supported by Markup viz. Article, Book Reviews, Events, Local Businesses, Movies, Products, Restaurants, Software Applications and TV Episodes etc. and therefore you may use one of them which fits to your blog.