Show last updated date in Blogger posts

 Author:   Posted on:   Updated on:  2017-10-29T13:13:28Z
Although this is not the kind of post for this blog, I decided to write about this because there are opinions saying it is impossible to show updated date in Blogger posts. Blogger offers support only for the date when a post is published. You can, of course, edit the post and change published date, but that is not what most people want.
The method that follows is completely automatic and it will print the last date when you used the post editor on the specific post. It makes use of data stored in blog feed, because, although there is no tag for updated date in Blogger (something similar to published date tag data:post.timestamp), the updated date is stored in your blog feed. I first noticed this when I registered my blog on Tapatalk and noticed that updated posts appeared on top of the list.
Show last updated date in Blogger posts

New method

In order to be compliant to structured data tags format, Blogger actually provides a way to get the that a post was updated. The tag is data:post.lastUpdatedISO8601, but I can't find its documentation at official Blogger documentation page. It seems this tag has been around 2015. It doesn't require you to use jQuery or to have the blog feed enabled.

There is no way to change date format. So, you still have to use a script to format the ISO8601 date. Here is an example.
<span class='updated' expr:title='"Post was updated on " + data:post.lastUpdatedISO8601' id='updatedateinfo' itemprop='dateModified'>
    <data:post.lastupdatedISO8601/>
  </span>
  <script>
    var dates = "<data:post.lastUpdatedISO8601/>"
    var dateu = new Date(dates);
    var months = ["January","February","March","April","May","June","July","August","September","October","November","December"];
    document.getElementById("updatedateinfo").innerHTML = months[dateu.getMonth()] + " " + dateu.getDate() + ", " + dateu.getFullYear();
  </script>
That's all you have to do. The old method is still published below.

Prerequisites

Of course, you must have a Blogger blog. You must enable the feed by going to Settings, Other, Site Feed. I'm using Until Jump break setting, but I guess everything will work except None. Your blog must also use jQuery. Somewhere in your template you should have in the head section (or add if there isn't) the line:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js' type='text/javascript'/>
It's OK to use a different jQuery version.

The script

Here is the script originally written by Yu-Jie Lin that will fetch the feed as JSON, parse it, get the date and display it.
<b>Updated on:</b> <span id='updatedateinfo'>-</span>

<script>
var postID = "<data:post.id/>";
jQuery.getJSON('https://www.blogger.com/feeds/replace_with_blog_id/posts/summary/' + postID + '?alt=json-in-script&callback=?', function(data) {
    var entry = data.entry;
    var dateu = new Date(entry.updated.$t);
    var months = ["January","February","March","April","May","June","July","August","September","October","November","December"];
  document.getElementById("updatedateinfo").innerHTML = months[dateu.getMonth()] + " " + dateu.getDate() + ", " + dateu.getFullYear();
  document.getElementById("updatedateinfo").title = dateu;
}); 
</script>
The script will show the date inside a span element with id=updatedateinfo. Don't forget to adjust the URL with the correct blog ID.
You can improve it if you want. For example, you can compare published date with updated date and display updated date only if it is different.
This method has one big disadvantage. You can't use structured data tags for the span element (i.e. itemprop=dateModified) because search engines will not run the Javascript code and will not index updated date.

No comments :

Post a Comment

Please read the comments policy before posting.