Today we will discuss how you can use better schema.org meta data/ tags for Blogger. If you are thinking what is Schema.org meta tags? Then answer is, it is an alternative to Open graph meta data. Schema.org is now using by Google for Blogger blogs by default. If you have not updated your blog template recently then you are missing schema.org blog meta data/ tags, which is now available with every new Blogger template. Every one is now-a-days talking about Open graph meta tags, no body has taken the initiative to discuss about Schema.org meta data/ tags. So we are here to tell you in detail about this. A new Blogger template have only the two Schema.org meta data/ tags, these two are “name” and “description”. Schema have many meta tags properties for a blog, you can find these on this link – http://schema.org/Blog. We have created a Schema.org meta data/ tags setup for three page types of Blogger – Home Page, Item Page and Static Page. It will automatically generate all necessary Schema.org meta data information as output. You need not to do anything manually. Just create posts as you always do.

Schema.org Microdata for Blogger

To install/ inject Schema.org microdata in your old Blogger template

1. Just find this code –

<body>

If not found please try this –

<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>

2. Now copy the following code and paste it just Below searched <body> code –

<div itemscope='itemscope' itemtype='http://schema.org/Blog' style='display: none;'>
<b:if cond='data:blog.pageType != &quot;index&quot;'>
<meta expr:content='data:blog.pageName' itemprop='name'/>
<meta expr:content='data:blog.canonicalUrl' itemprop='url'/>
<b:else/>
<meta expr:content='data:blog.title' itemprop='name'/>
<meta expr:content='data:blog.homepageUrl' itemprop='url'/>
</b:if>
<meta expr:content='data:blog.metaDescription' itemprop='description'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' itemprop='image'/>
<b:else/>
<meta content='//blog-logo-url-square-size-is-good' itemprop='image'/>
</b:if>
</div>

If you are using New Blogger template

Then search for following code by using keyword “http://schema.org/Blog” –

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div itemscope='itemscope' itemtype='http://schema.org/Blog' style='display: none;'>
<meta expr:content='data:blog.title' itemprop='name'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' itemprop='description'/>
</b:if>
</div>
</b:if>

and replace “entire” code with the following code –

<div itemscope='itemscope' itemtype='http://schema.org/Blog' style='display: none;'>
<b:if cond='data:blog.pageType != &quot;index&quot;'>
<meta expr:content='data:blog.pageName' itemprop='name'/>
<meta expr:content='data:blog.canonicalUrl' itemprop='url'/>
<b:else/>
<meta expr:content='data:blog.title' itemprop='name'/>
<meta expr:content='data:blog.homepageUrl' itemprop='url'/>
</b:if>
<meta expr:content='data:blog.metaDescription' itemprop='description'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' itemprop='image'/>
<b:else/>
<meta content='//blog-logo-url-square-size-is-good' itemprop='image'/>
</b:if>
</div>

In any case must not forget to change the value “//blog-logo-url-square-size-is-good” with your blog’s logo url. A square blog logo is much appreciated.

GitHub gist – https://gist.github.com/vinayprajapati/5881629

If have any question on please comment below.