GeneratePress Show The Last Updated Post Date A Tutorial

How to show last updated date in WordPress, using GeneratePress

So you update your content on your website, perhaps you’ve just updated an old post, maybe made some slight alterations, improved it and what not.

Then you have to add in some text, stating that is was updated.

A pain in the rear right? I mean for every single amendment to old posts, you have to go in and add “last updated date.” A nuisance in truth.

It’s best practice to inform visitors that there was an update on a specific date. It keeps your content fresh and tells the visitor of the latest revision.

Well if you’re using the GeneratePress theme and want to show the last updated time, you’re in luck.

By default, GeneratePress outputs a published date, and a modified time in its code, see below for a structured data test:

The above is taken from this actual post (even though I’ve not released it as yet). It’s a great feature and helps Google see if your content was updated. But I want to show it on the front end as well. So….

How To Show Last Updated Post Date In GeneratePress

I’m going to show you how to do just that, and as my other post on how to add breadcrumbs to GeneratePress, it’s a breeze to do. It should take no more than 5 minutes.

Kudos to the people who noticed the published date is spelled wrong! Anyways by editing the last part of the code mentioned above you can add this to your date section. Again I think this might be a little too much, but you know best.

The CSS Snippet Needed To Show Updated Post Date

Very simple this, see below for the CSS snippet you need to display the last updated time:

.posted-on .updated {
display: inline-block;
}
.posted-on .updated + .entry-date {
display: none;
}
.posted-on .updated:before {
content: “Last Updated”;
}

It’s taken directly from the folks over at GeneratePress, so the code is good. Just cut the above and hold off pasting it just yet.

Adding The CSS Code To Display The Last Updated Date In GeneratePress

While in the backend of your website in the top left, hover over the home icon and navigate to your website. Once on the front end, you might want to navigate to a blog post to see this take effect.

Once on the post of your choice, navigate to the top left again of your WordPress admin bar and hit customize.

Paste your CSS Code into the additional CSS box

When you’re greeted with the customize sidebar overlay, you need to hit Additional CSS should be close to the bottom of the navigation.

Once you’ve cut and pasted the code into the Additional CSS box, hit publish and that is it. It’s that simple. Now hit refresh or go in and edit an old post and see the magic happen.

Not happy with the words Last Updated?

You can change it if you like by editing the below see where it says “change me “:

.posted-on .updated {
display: inline-block;
}
.posted-on .updated + .entry-date {
display: none;
}
.posted-on .updated:before {
content: “change me “;
}

Just make sure to retain the space at the end of your chosen word, to ensure it doesn’t overlap into the date of the post.

Show the Last updated and original published date

Entirely optional, if you wanted to show the Last updated date and the date the article was initially posted on then you can cut and paste the following code into the additional CSS box:

.posted-on .updated {
    display: inline-block;
}
.posted-on .updated + .entry-date {
    display: inline;
}
.posted-on .updated:before {
    content: “Last Updated “;
}
.posted-on .entry-date:before {
content: ” Originally Published on ” ;
}

I think the above code is overkill but hey, I’m not you, and you might want to display both!

Kudos to the people who noticed the published date is spelled wrong! Anyways by editing the last part of the code mentioned above you can add this to your date section. Again I think this might be a little too much, but you know best.

There’s a benefit to showing the last updated date to users on the front end

It shows that you regularly update your content, be it an amendment to an existing post after fact checking or other reason.

When users scroll through your content or land on the page from a search engine, it serves as a notice that this individual is actively maintaining their blog.

Not only that but as a content creator browsing through your blog from the front end, it may well draw your attention to some neglected old posts.

Especially if they are quite old, it may well encourage you to edit the post and update it. If you ever performed a blog audit yourself.

It Only took about 5 minutes to do right?

A nice quick and easy tutorial to add the last updated date to your GeneratePress theme. If I’ve helped you in any way, please do leave a comment on the post below.

Want more tutorials on GeneratePress?

If you’d like to learn more of what is possible with GeneratePress, take a look at my GeneratePress tutorials here.