Displaying relative dates in WordPress can be a great way to improve the user experience on your website. Instead of displaying exact dates, you can opt for a more user-friendly format that indicates how much time has passed since an event. This is especially useful in blogs and publications where the relevance of the content may decrease over time. Here's a quick guide on how to implement this functionality on your WordPress site.
What Are Relative Dates?
Relative dates are expressions that indicate the time elapsed since an event in a more understandable format. Instead of displaying a specific date, such as «March 12, 2022», you could display «3 days ago» or «2 weeks ago». This form of presentation can make content appear more current and relevant to readers.
Benefits of Using Relative Dates
- Improve Usability: Users can quickly and easily understand how recent the information is.
- Increases Interaction: Visitors may be more inclined to read more recent publications.
- SEO optimization: Google and other search engines favor fresh and updated content.
How to Implement Relative Dates in WordPress
To display relative dates in WordPress, there are several options you can explore. From plugins to custom code, the possibilities are vast. Here are some of the most effective ones.
Use of Plugins
One of the easiest ways to display relative dates is through plugins. There are several available in the WordPress repository that can facilitate this task. Some of the most popular ones are:
- WP Relative Date: This plugin allows you to display relative dates in your posts and comments automatically.
Download our web maintenance guide Free of charge!Free guide for freelancers and small businesses that want to avoid surprises and improve their web performance. - Time Ago: An option that is easily integrated and allows you to customize the format of the dates.
Installing a plugin is simple. You just need to go to your WordPress admin panel, select «Plugins» and then «Add new». Find the plugin you want to install, click «Install» and then «Activate». Once activated, follow the plugin's instructions to configure it according to your needs.
Custom Code in Theme
If you prefer not to use a plugin, you can opt to add custom code in your theme. Below, I show you a code snippet that you can use to display relative dates:
function show_relative_date(1TP4Date) {
$elapsed_time = strtotime($date);
$difference = time() - $elapsed_time;
if ($difference
You can add this code to the file functions.php of your theme. Then, simply call the function show_relative_date in the place where you want the publication date to appear.
CSS for Stylizing Relative Dates
Once you have implemented relative dates, you may want to style their appearance to better integrate with the design of your site. Here's an example of CSS you can add to your file style.css:
.date-relative {
font-style: italic;
color: #555;
}
With this code, any dates you are displaying in relative format can be styled in a more attractive and readable way. Just be sure to add the date-relative to your date elements in the HTML.
Testing and Adjustments
After implementing the relative dates, it is crucial to test to make sure everything works correctly. Check on different devices and browsers to ensure that the presentation is consistent. Also be sure to check site performance, as plugins can affect loading speed.
Future Adjustments
Remember that you can always go back and adjust the way relative dates are presented. You can experiment with different formats and styles until you find the one that best suits your website and your visitors. Also, keep an eye out for updates to the plugins you use, as they may offer new features and improvements to the display of dates.
