Date

Renders a date picker from which a creator can select a date.

Returns: A date string, which can be formatted using the Liquid date filter.

Any date chosen in the site builder will reflect the creator's timezone. The date may require converting to UTC before being used in the theme — for example, to compare against today's date.

Example

---
attributes:
  event_date:
    type: date
    label: Event date
    default: today
---

<p>{{ event_date | date: "%d %B %Y" }}</p>

Setting defaults

The default value accepts today to use the current date.

Usage

Date formatting

Use the Liquid date filter to format dates (reference):

{{ event_date | date: "%d %B %Y" }}
<!-- Output: 15 March 2025 -->

{{ event_date | date: "%a %e %b" }}
<!-- Output: Sat 15 Mar -->

Comparison

Format dates to epoch values (%s) to compare them:

{% assign event_epoch = event_date | date: "%s" %}
{% assign today_epoch = "today" | date: "%s" %}

{% if event_epoch > today_epoch %}
  <p>This event is in the future</p>
{% else %}
  <p>This event has passed</p>
{% endif %}

Array of dates

---
attributes:
  important_dates:
    type: date
    label: Important dates
    array: true
    default:
      - today
---

{% for date in important_dates %}
  <time>{{ date | date: "%d %B %Y" }}</time>
{% endfor %}