Servage Magazine

Information about YOUR hosting company – where we give you a clear picture of what we think and do!

Auto-updating timestamps with Timeago

Wednesday, August 31st, 2016 by Servage

timeagoAutomatically-updating timestamps is a feature found on many popular websites, especially on social networks. With Timeago, a JavaScript timestamp library, these special timestamps are created using the HTML5 <time> tag. What makes them special is their automated ability to update themselves as time goes by without having to reload the page.

How Timeago works?

When Timeago loads, it starts looking for HTML <time> tags with a class of “timeago” and changes how they are displayed to the visitor, such as “4 hours ago”. Timeago also requires the <time> tags to use a specific time format; otherwise it cannot read the dates correctly. More specifically, all <time> tags must use the ISO 8601 specification, which is fortunately quite easy to use. For example, “2016-01-01” would turn into “4 months ago” if the website is visited in May 2016.

How to use Timeago?

To use Timeago on your own website, first you have to include jQuery using the <script> tag. Next, include the Timeago JavaScript file in the same fashion. jQuery can be downloaded from www.jquery.com and Timeago from timeago.yarp.com.

When you have these files on your website, you have to call a function from the Timeago library to enable it. The function to call is $(“time.timeago”).timeago(). It is recommended to run the function when the document has been loaded using the $(document).ready() function. For more information, have a look at the documentation on the official Timeago website.

If you open your website now, all <time> tags with a class of “timeago” and the correct time format should now have turned into Timeago timestamps!

What is Timeago useful for?

Timeago is a small but powerful library. Many, many websites use it or a similar library to display dynamic timestamps. It can be found on blogs, comments, forums, social media and many other websites. In fact, you can use it on almost any website that uses times and dates.

However, it is not suitable for everything. Sometimes you may want to use an exact date, but a Timeago timestamp works better in other places: “a company was founded on June 23, 2011” while “this page was last updated 6 days ago”.

So which one should you use and when? The general rule is to use the one that serves the visitor better, or in other words, the one that is easier and faster to understand.

Auto-updating timestamps with Timeago, 4.2 out of 5 based on 5 ratings
Categories: Guides & Tutorials

Keywords:

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

No comments yet (leave a comment)

You are welcome to initiate a conversation about this blog entry.

Leave a comment

You must be logged in to post a comment.