I was updating my bookmarks page and wanted a way to indicate the stuff that I’d added recently, which led me to thinking about how to identify posts from a particular timeframe.
How can I mark recent posts based on a particular timeframe?
I considered a couple of options (listed below) and ended up with a fairly simple solution using relative time, something WordPress has built-in. On the front-end, it just adds a little clock icon next to the title of any resource added within the last 30 days:
My first thought was that I could use PHP to check whether the post date was within a certain range.
1. Compare Year and Month
I was thinking maybe I’d check the post year against the current year, then if it matched I’d check against the current month. However, I dismissed that before I got past about 20 characters of code because I realized that it would throw off the time frame of the results depending on where in the month we are. Oh well, we all have bad ideas sometimes.
2. Date Calculations
Then I was thinking I’d use PHP to check the date against a relative time frame, e.g. the last 30 days. Something like the reverse of this Stack Overflow question and solution.
That would work, but then I remembered that WordPress has relative post date built in, where you can display the time as “1 day ago” or “30 minutes ago” using the function
human_diff_time (function reference). Hooray, even better!
3. Using Relative Time
So then I was thinking, with that relative time I just need to check and see if we’re in the right time frames to be what I’d consider “recent.” The numerical values returned won’t be useful but the words are definitely useful. I double checked when the transition in words happens by looking at the core code underneath that function. I was able to confirm that anything with a relative time in minutes, hours or days has been posted in the last 30 days, and I’d consider that recent.
Here’s the full solution I ended up with (limited to just the template code within the loop, since the rest of the template is irrelevant to the question):
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?> <?php $postdate = human_time_diff( get_the_time('U'), current_time('timestamp') ); // get the post date in relative time $recentvals = array('min','mins','hour','hours','day','days'); // the values I consider "recent" ?> <li class="filterable"> <a href="<?php the_field('url'); ?>"> <span class="project-title"><?php the_title(); ?><?php foreach ( $recentvals as $recentval ) : if ( strpos($postdate, $recentval) !== FALSE) : echo ' <i class="fa fa-clock-o"></i><span style="display:none;">new</span>'; endif; endforeach; ?></span> </a> <span class="small"><?php the_field('description'); ?></span> </li> <?php endwhile; ?>
Let’s take a closer look piece by piece at what this code does:
First up, there are two pieces of information I want to use in my comparison. That’s this part of the code:
<?php $postdate = human_time_diff( get_the_time('U'), current_time('timestamp') ); // get the post date in relative time $recentvals = array('min','mins','hour','hours','day','days'); // the values I consider "recent" ?>
There are two variables set up here:
- The post’s relative publication date, meaning how long ago it was posted in words (e.g. “20 mins” or “2 days”)
- The time frames I want to include as “recent,” using the words provided by that relative time function (options are: “mins,” “hours”, “days,” “weeks,” “months,” and “years” and the singular of each of those)
For the first, I just used WordPress’s built-in function, straight off the Codex page except I’m assigning it to a variable rather than echoing it (displaying it) on the page.
For the second, I have created an array of the words I’ll accept as “recent,” using both the singular and plural forms. I’m actually not sure if it’s possible to just use the singular and I don’t feel like testing it so I’ve just used both for safety’s sake.
Compare the Two
Next, I need to figure out whether the current post date for each post contains any of the words in my array. I referenced this thread on Stack Overflow for this code:
<?php foreach ( $recentvals as $recentval ) : if ( strpos($postdate, $recentval) !== FALSE) : echo ' <i class="fa fa-clock-o"></i><span style="display:none;">new</span>'; endif; endforeach; ?>
This runs through each of the allowed time frame words in my array and compares them against the post date. If one comes up as a match, it prints out the code in the
Show the Icon, Plus Search
The printed HTML from that snippet is:
<i class="fa fa-clock-o"></i><span style="display:none;">new</span>
That creates the Font Awesome clock icon along with a hidden span (I know, I know, lazy inline CSS). The hidden span is there so that it’s possible to use the in-page “search” function to pull up the new posts.
If you’re going to implement this yourself, the key things to remember are:
- The code needs to be within the loop, including the bit where you set the variables.
- You’ll need to determine which words constitute “recent” and update your array accordingly.
- You’ll likely also need to update your icon/ display HTML to fit your purposes (whether it’s just displaying text or adding in an image or another icon font or whatever).