October 17, 2015

Fix datePublished Missing And Required Error For Blogger


You check your Blogger blog with Structured Data Testing tool, and you have this datePublished error remark.

Fix datePublished Missing And Required Error For Blogger

Solve datePublished Missing And Required Blogger


Here is tutorial on how to fix this datePublished error.

It looks complicated because it involves many code. Look properly and follow closely.

I break it up into three parts, so it is clearer for you to follow.

1. Log into your Blogger Dashboard.

2. Click Theme.

3. Click on the edit HTML button.

Part One:

4. First search for this code:

<div class='date-posts'><div class='post-outer'><div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>
5. Next copy the code below:

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><span class='updated'><data:post.dateHeader/>T<data:post.timestamp/></span></abbr></a>
6. Now paste it BELOW the code which you found at #4.

7. After pasting it, it should look like this:

<div class='date-posts'><div class='post-outer'><div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><span class='updated'><data:post.dateHeader/>T<data:post.timestamp/></span></abbr></a>
Part Two: 8. Now look for this code:

<div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='https:// schema.org/BlogPosting'>
9. Next copy this code:

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><span class='updated'><data:post.dateHeader/>T<data:post.timestamp/></span></abbr></a>
10. Now paste it BELOW the code  which you have found at #8.

11. When paste together, it looks like this:

<div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='https:// schema.org/BlogPosting'>

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><span class='updated'><data:post.dateHeader/>T<data:post.timestamp/></span></abbr></a>
Part Three:

12. Now look for this code:

<meta expr:content='data:post.canonicalUrl' itemprop='url'/>
Note: Some of you may have 2 or even three of this code. As for my Blogger template called Simple by Josh Peterson, it only has one set of this code.

13. Then copy this code:

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><span class='updated'><data:post.timestamp/></span></abbr></a>
14. Paste it BELOW the code you found at #12.

15. When paste together, it looks like this:

<meta expr:content='data:post.canonicalUrl' itemprop='url'/>

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><span class='updated'><data:post.timestamp/></span></abbr></a>
16. Finally click the orange color Save template button.

17. That's all.

Reminder:  All the three set of code which you copied from here, you paste it BELOW the code which you found in your template.

The procedure for Part One, Part Two and Part Three is the same.


Now go to Google Structured Data Testing Tool to check whether you have fixed the datePublished Missing error.

You paste your blog URL in the box provided and then click the red color FETCH & VALIDATE button.


 Note:
After you have done according to the tutorial above and if you notice there is this date and time showing above your blog post title.

 Don't worry. This is what you need to do to hide this date and time.

1. You go to Template.

2.  Click the Customize button.

3. Click on Advanced.

4. Pull down the slider and click on "Add CSS". A box will appear next to it

5.  Now paste the code below in the empty box provided.

 abbr.published {
display: none;
}
6. Click on "Apply to Blog" button.

7. Now the text above your blog post title should be gone. 

*Here is how to fix image missing and required error for Blogger.


Note: All tutorials on customizing Blogger template featured in this blog, I am using Simple template by Josh Peterson.



Written by: Kher Cheng Guan