Display the “time ago” of a posted item
This snippet displays a date friendly conversion for the number of secs/mins/hrs/days/wks/mths/yrs since an item was posted. (supports language customisations)
-
The current code works off the items ‘Release Date’, however you can modify this to use an alternative date of your choice.
Place the Part 1 code at the top of your item’s list or detail layout so that it can generate a set of variables you can use further down in your layout (see Part 2 below).
NOTE: The first 5 Liquid variables (
assign
) are typical display values you may wish to change (including the Release Date to some other date). The remaining code most likely won't need modification.{% comment %}<!-- Treehouse CODE v1.0.0 -->{% endcomment %} {% assign myDate = this.ReleaseDate %} {% assign intervalPlural = "s" %} {% assign pastPhrase = " ago" %} {% assign daysPhrase = " ([n] days)" %} {% assign daysAlwaysDefault = "Less than a day ago" %} {% assign friendlyDaysIf = "" %} {% assign friendlyDaysOnly = "" %} {% assign nowDateSec = "now" | date: "%s" | minus: 0 %} {% assign modDateSec = myDate | date: "%s" | minus: 0 %} {% assign total = nowDateSec | minus: modDateSec | round %} {% if total < 60 %} {% assign interval = "second,1" | split: "," %} {% elsif total < 3600 %} {% assign interval = "minute,60" | split: "," %} {% elsif total < 86400 %} {% assign interval = "hour,3600" | split: "," %} {% elsif total < 604800 %} {% assign interval = "day,86400" | split: "," %} {% elsif total < 2419200 %} {% assign interval = "week,604800" | split: "," %} {% elsif total < 31536000 %} {% assign interval = "month,2419200" | split: "," %} {% else %} {% assign interval = "year,31536000" | split: "," %} {% endif %} {% assign term = interval[0] %} {% assign termSeconds = interval[1] | plus: 0 %} {% assign timeAgo = total | divided_by: termSeconds | round %} {% if timeAgo <= 1 %} {% assign intervalPlural = "" %} {% endif %} {% assign friendlyDateDiff = timeAgo | append: " " | append: term | append: intervalPlural | append: pastPhrase %} {% assign daysAgo = total | divided_by: 86400 | round %} {% if daysAgo < 1 %} {% assign friendlyDaysOnly = daysAlwaysDefault %} {% else %} {% assign friendlyDaysOnly = daysPhrase | replace: "[n]", daysAgo | replace: ")", pastPhrase | append: ")" %} {% endif %} {% if daysAgo > 6 %} {% assign friendlyDaysIf = daysPhrase | replace: "[n]", daysAgo %} {% endif %}
-
There are 3 main outputs you can use (with some in combination if needed):
{{friendlyDateDiff}}
{{friendlyDaysIf}}
{{friendlyDaysOnly}}
For example:
{% comment %}<!-- Treehouse CODE v1.0.0 -->{% endcomment %} <p>Posted {{friendlyDateDiff}}</p> <!-- eg: Posted 3 weeks ago --> <p>{{friendlyDaysIf}}</p> <!-- eg: (18 days) --> <!-- will only output something if > 1 week --> <p>Posted {{friendlyDateDiff}}{{friendlyDaysIf}}</p> <!-- eg: Posted 3 weeks ago (18 days) --> <!-- only showing the days in brackets if > 1 week --> <p>{{friendlyDaysOnly}}</p> <!-- eg: (18 days ago) --> <!-- only shows 'days ago' with a default of "Less than a day ago" if < 1 day -->
-
OPTIONAL:
If you need to account for a different language and/or more complex pluralisations, this alternative code can be used where you can specifiy the interval names used:{% comment %}<!-- Treehouse CODE v1.0.0 -->{% endcomment %} {% assign myDate = this.ReleaseDate %} {% assign pastPhrase = " ago" %} {% assign daysPhrase = " ([n] days)" %} {% assign daysAlwaysDefault = "Less than a day ago" %} {% assign secondsTerm = "second" %} {% assign secondsPlural = "seconds" %} {% assign minutesTerm = "minute" %} {% assign minutesPlural = "minutes" %} {% assign hoursTerm = "hour" %} {% assign hoursPlural = "hours" %} {% assign daysTerm = "day" %} {% assign daysPlural = "days" %} {% assign weeksTerm = "week" %} {% assign weeksPlural = "weeks" %} {% assign monthsTerm = "month" %} {% assign monthsPlural = "months" %} {% assign yearsTerm = "year" %} {% assign yearsPlural = "years" %} {% assign friendlyDaysIf = "" %} {% assign friendlyDaysOnly = "" %} {% assign nowDateSec = "now" | date: "%s" | minus: 0 %} {% assign modDateSec = myDate | date: "%s" | minus: 0 %} {% assign total = nowDateSec | minus: modDateSec | round %} {% if total < 60 %} {% assign interval = "{{secondsTerm}},{{secondsPlural}},1" | split: "," %} {% elsif total < 3600 %} {% assign interval = "{{minutesTerm}},{{minutesPlural}},60" | split: "," %} {% elsif total < 86400 %} {% assign interval = "{{hoursTerm}},{{hoursPlural}},3600" | split: "," %} {% elsif total < 604800 %} {% assign interval = "{{daysTerm}},{{daysPlural}},86400" | split: "," %} {% elsif total < 2419200 %} {% assign interval = "{{weeksTerm}},{{weeksPlural}},604800" | split: "," %} {% elsif total < 31536000 %} {% assign interval = "{{monthsTerm}},{{monthsPlural}},2419200" | split: "," %} {% else %} {% assign interval = "{{yearsTerm}},{{yearsPlural}},31536000" | split: "," %} {% endif %} {% assign termSingular = interval[0] %} {% assign termPlural = interval[1] %} {% assign termSeconds = interval[2] | plus: 0 %} {% assign timeAgo = total | divided_by: termSeconds | round %} {% if timeAgo > 1 %} {% assign term = termPlural %} {% else %} {% assign term = termSingular %} {% endif %} {% assign friendlyDateDiff = timeAgo | append: " " | append: term | append: pastPhrase %} {% assign daysAgo = total | divided_by: 86400 | round %} {% if daysAgo < 1 %} {% assign friendlyDaysOnly = daysAlwaysDefault %} {% else %} {% assign friendlyDaysOnly = daysPhrase | replace: "[n]", daysAgo | replace: ")", pastPhrase | append: ")" %} {% endif %} {% if daysAgo > 6 %} {% assign friendlyDaysIf = daysPhrase | replace: "[n]", daysAgo %} {% endif %}
Comments or questions? Head over to the Treepl CMS forum to discuss with the community.