Ever wondered why such a simple feature like this isn’t already implemented into WordPress? We are not sure either.

Fortunately, there are some plugins that offers a solution to this. However, plugins bloat your website, which is why you should code them yourself, making that feature as lightweight as possible.

Why do you need an “Updated At” date?

The date of publish is already a native feature of WordPress, which is fine for smaller blogs like mine.

A “Last Updated” date

But if you have dynamic content that changes often, it makes sense to show an “Edited at” or an “Updated on” date, whichever way you call them.

It is a best practice to show the date so that your readers will know that it is updated. On post articles like tutorials and news, where information changes often, it is crucial that you show the updated date so that they are aware of edits, new developments, or corrections.

You could, however, append the edited date into the article directly, but there are some instances where you need it to be displayed, flush with the other header elements.

Another benefit of this feature is that you do not need to manually enter the date. WordPress will detect the post’s last edited date and display it wherever you want it to be, as long as it is within the post itself.

How does this feature work?

Basically, if the post is new, without any updates or revisions, the “Updated Date” will not appear. However, if there are revisions or updates, it will show up.

If there are no Revisions or updates, then the date will not appear.

Coding the feature into WordPress

If you are a beginner in WordPress development, we are going to edit to the file called functions.php. This file is usually found within your theme and is easily accessible via WordPress, FTP, or your hosting’s file manager.

We are going to access this via the theme editor built into WordPress.

Once you are on that page, make sure that you have selected the correct theme (the one that you are using now), and load the functions.php file.

Now, scroll all the way to the bottom of the file. If you are accessing this file via any other method, do the same too.

Disclaimer: Please make sure that you know what you are doing. Either make a backup of the file or comment off the codes you wish to remove. I am not responsible for any damages to your website.

Method 1: Create a custom shortcode

Copy and paste the code below, and ensure that you insert it at the bottom of the functions.php file.

function display_last_updated_date() {
	$created_time = get_the_time('U');
	$modified_time = get_the_modified_time('U');

	if ($modified_time > $created_time) {
	   $updated_day = get_the_modified_time('F j, Y');
           $updated_text .= '<p>Last Updated on: '.$updated_day.'</p>';
	   return $updated_text;
	}
}
add_shortcode( 'modified_date', 'display_last_updated_date' );

The second line of code calls the get_the_time() method which returns the time in which the article was first published.

The third line of code calls the get_the_modified_time() method which returns the time in which the article was last modified.

If you realised, we passed the parameter ‘u’ in both methods. This is so that the returned time will be encoded in the Unix timestamp format.

The next line of code compares two variables. Variables encoded in the Unix timestamps can be compared like so. If the “modified” timestamp is greater than the creation timestamp, then the content variable will be appended with the date of modification.

As you see within the codes, you can also append HTML tags, which allows for custom CSS. You can also include classes and ids.

Finally, an add_shortcode hook is used. You can use the shortcode [modified_date] anywhere on the website. It will output the date of modification.

When the shortcode is used, the output will look like:

Last updated on February 24th, 2020

Showing the time

You can append the Modified Date with time as shown below

   $updated_time = get_the_modified_time('h:i a'); 

Method 2: Adding the updated date before the content

If you prefer to simply add it after the title and before the content, you can do so by changing a line of code.

function display_last_updated_date() {
	$created_time = get_the_time('U');
	$modified_time = get_the_modified_time('U');

	if ($modified_time > $created_time) {
	   $updated_day = get_the_modified_time('F j, Y');
           $updated_text .= '<p>Last Updated on:'.$updated_day.'</p>';
	   return $updated_text;
	}
}
add_filter( 'the_content', 'display_last_updated_date' );

Basically, just change the add_shortcode method to add_filter. What this does is that it appends the modified date to the section, just before the post’s content.

As you can see from the add_filter method, the first parameter is the_content. It is basically a pre-defined WordPress filter that allows you to do something before that element. That function that it performs is called a hook.

There are a ton of WordPress filters available for use. You can check it out here: https://codex.wordpress.org/Plugin_API/Filter_Reference

Method 3: Implementing directly into your theme

We are not sure how your theme works, but this method should work with most themes.

You want to locate the file single.php either by using the Theme Editor, FTP, or a file manager. This file controls the layout of the single blog post.

Identify and locate the location within the code that controls the display of the publish date, or wherever you want to place the Modified At code.

Copy and paste the codes below:

$created_time = get_the_time('U'); 
$modified_time = get_the_modified_time('U'); 
if ($modified_time > $created_time) { 
  echo "<p>Last modified on "; 
  the_modified_time('F j, Y'); 
  echo "</p> "; 
} 

Conclusion

This article assumes that you have at least an intermediate knowledge working with WordPress. Make sure that you know what you are doing!

I wrote this article because I realised that there isn’t any tutorial that shows exactly how to implement the Modified Date feature. They were either a blatant copy-paste from another article, or weren’t as informative.

This isn’t exactly a plugin, but I may write a future post on how to create a WordPress plugin. I may use this feature as an example on the plugin.

I tried my best to make this as informative and as in-depth as possible. Feel free to leave your comments below if you need more help, I will try my very best.

harold

harold

I love working with people, integrating technologies, and adding value to my clients' company. I am a major WordPress geek with over 10 years of web development experience. On my free time, I enjoy traveling and mingling with people.

Leave a Reply

avatar
  Subscribe  
Notify of