Date format like Facebook

Does anyone know how to format feed dates similar to Facebook:
12:23pm
6 hrs ago
2d
1w
… etc.?

Thanks

You’ll need to have some different conditions on your text element depending on how long ago the date was. Each condition having a range that the time would fall between with the appropriate text shown. Make sure you don’t have any holes in your time ranges by using either < > ≥ ≤ signs

A few examples would be

Just posted within 1 minute
Current date/time - Parent group's Post's Date:formatted as minutes < 1
Set text to: “Just now”

Between 1min and 1 hour
Current date/time - Parent group's Post's Date:formatted as minutes ≥ 1 and Current date/time - Parent group's Post's Date:formatted as minutes < 60
Set text to: "Current date/time - Parent group's Post's Date:formatted as minutes mins ago"

Between 1hr and 24hr
Current date/time - Parent group's Post's Date:formatted as hours ≥ 1 and Current date/time - Parent group's Post's Date:formatted as hours < 24
Set text to: “Current date/time - Parent group's Post's Date:formatted as hourshrs ago”

Between 1 day and 7 days
Current date/time - Parent group's Post's Date:formatted as days ≥ 1 and Current date/time - Parent group's Post's Date:formatted as days < 7
Set text to: “Current date/time - Parent group's Post's Date:formatted as daysd ago”

Greater than a week (like Instagram saying 24w ago)
Current date/time - Parent group's Post's Date:formatted as days ≥ 7
Set text to: “Current date/time - Parent group's Post's Date:formatted as days/7w ago”

And so on…

If you get weird numbers with long decimal points, add a :floor to the end to bring it to the lower whole number

2 Likes

While you can mimic this in certain specific conditions and formatting expressions (as @tylerboodman helpfully notes), typically this is accomplished with various libraries for formatting dates in this way. Like these:

The browser itself actually has a native interface (API) for displaying dates this way called Intl.RelativeTimeFormat (which you can read about here).

Many of the libraries out there are wrappers to make interfacing with that API a little simpler. Surely in the plugins tab you can find Bubble plugins for relative time formatting and one of them might actually be good… who knows? I haven’t written one myself and haven’t used any of those, so do not have one to recommend.

I’ve seen some bad ones, though (e.g., server-side actions for this, which is NOT what you want, not at all).

3 Likes

This topic was automatically closed after 70 days. New replies are no longer allowed.