Age
SA5 Format Dates. Quick setup for the most popular use cases.
Indicates the exact age, in years, between the specified date and today. Designed for past dates, such as birthdates.
Getting Started
STEP 1 - Add the Library
First, add the library as detailed in Quick Start.
STEP 2 - Apply the custom attributes
SA5's formatting attributes are element-specific. You simply apply the custom attributes to the date elements you want specially formatted.
The details on the attributes are below.
Usage Notes
Place these attributes directly on element with the date or date-time value you want to format. These can be static strings, or CMS-bound.
For best results, format the string using Webflow's YYYY-MM-DD
format option, to ensure the best parsing for Day.js scripts.
wfu-format-mode
= age
wfu-format-mode
= age
Required. Specifies the mode as age display.
wfu-format-date
= ( no value needed )
wfu-format-date
= ( no value needed ) Required. However the string itself is not used in this mode.
wfu-format-suffix
= ( enable / disable )
wfu-format-suffix
= ( enable / disable )Optional. Place directly on the element with the wfu-format-date
attribute.
on
( default ) will apply prefix and suffix text such as "in 3 months", or "3 months ago."off
will display the raw numeric value only, e.g. "3."
Notes
These attributes are not needed, as the default value is appropriate for this use case;
wfu-format-mode
=date
wfu-format-handler
=dayjs
These attributes are incompatible;
wfu-format-locale
Last updated
Was this helpful?