August 7, 2015

How to Add Structured Data Markup To Blogger Template


 Here is a tutorial on how to add structured data markup to Blogger Template, so that it can help to improve the visibility of your blog posts in the search results.

how to add structured data markup to Blogger

Before you do  anything, do a quick test to check whether you have already add structured data markup tags.

1. Go to: Google Structured Data Testing Tool

2. Click on the area with the remark:

1. Imput your source code
Just paste it here OR Fetch URL

 

3. All the remarks will disappear. Now paste your blog post URL here.

4. Then click on the red color VALIDATE button.

5. If you do not have structure data, you will see this remark:

No structured data present

Important: Before you add any thing to your template, back up your Blogger first.

Add Structured Data Markup To Blogger Template


Add Root Class Name Hentry


1. Find this code:

<div class='post'>
2. Add the word hentry AFTER the word post.

3. Now it should look like this:

<div class='post hentry'>
4. Note: You will find a few <div class='post'> on your blogger template.

5. Do the same thing to all the rest of <div class='post'> code.

6. Click Save template button.

Add An Entry-Title


1. Find this code:

class='post-title
2. Add entry-title AFTER the word title.

3. Now it should look like:

class='post-title entry-title'
4. Again you will also find two or more set of  class='post-title on your template.

5. Do the same thing to all the rest of them.

6. Click Save template button.

Add An Entry-Content


1. Find this code:

<div class='post-body
2. Add entry-content AFTER the word body.

3. Again you will find a couple of <div class='post-body on your template.

4. Do the same thing to all the rest of them.

5. Click Save template button.

Fix Errors On Updated


1. Look for this code:

<data:post.timestamp/>
2. Just before that code you will find span class that looks like this:

<span class='updated'><data:post.timestamp/></span>
3. Replace that code to this:

<span class='updated'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></span>
4. Click Save template button.

Fix Errors On Author


1. Look for this code:

class='post-author
2. After the word author you insert this text vcard.

3. Now it should look like this:

class="post-author vcard"
4. Then, look for this code:

<data:post.author/>
5. Replace it with this code:

<span class='fn author'><data:post.author/></span>
6. Click Save template button.

Now go to Structured Data testing tool to check whether everything is properly done.


Written by: Kher Cheng Guan