> For the complete documentation index, see [llms.txt](https://kb.craftformswp.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://kb.craftformswp.com/documentation/form-building/create-form/blocks/date-and-time-fields.md).

# Date and Time Fields

The **Date**, **Time** and **Date and time** fields ask for a day, a time of day, or both. Visitors pick them with their browser's own calendar and clock, so the field looks right on every phone and computer and needs nothing extra on your site. You can stop dates in the past, keep a return date after the pick-up date, or allow only office hours in quarter-hour steps. CraftForms checks all of it again on your server when the form is sent.

![A hire request form with a pick-up date, return date, pick-up time and a date and time field](https://97821998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FM2yV1foUgoGHBC66VBDw%2Fuploads%2FRpkNy0YRQoYtpz48Nxxh%2Fdate-and-time-fields--form-filled.jpg?alt=media)

### What you need

* **CraftForms (free)**, version 2.3 or later. The three fields are in the free version.
* Need a booking calendar with availability, prices per night or time slots? That's the [Booking Datepicker Field](/documentation/form-building/create-form/blocks/booking-datepicker-field.md) (PRO). Use the fields on this page for any other date: a birthday, a delivery day, a preferred call-back time.

### Add a date or time field

1. Open your form in the editor (**CraftForms → Forms → Edit**).
2. Click the **+** (block inserter) and type **date** or **time**.
3. Choose **Date**, **Time** or **Date and time**. All three have a calendar icon or a clock icon and come from CraftForms (WordPress's own *Post Date* block is something else).
4. Give the field a **Label**, like "Pick-up date". The **Field Name** is filled in from it.
5. Optional: open the **Validation** panel and set **Required**, **Earliest** and **Latest** (see below).
6. Save the form.

![The block inserter searching for "date", with the Date and Date and time fields](https://97821998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FM2yV1foUgoGHBC66VBDw%2Fuploads%2FeKTGkmtgX8SomW7iazbj%2Fdate-and-time-fields--inserter.jpg?alt=media)

Each of the three is a Text Input Field with its **Input Type** set to **Date**, **Time** or **Date and time**. So they keep everything a Text Input Field has: conditions, columns, Field Links, the help popup. You can also turn an existing Text Input Field into one by changing its **Input Type**.

### Settings

![The settings of a Date field: Input Type Date, and Earliest set to another date field](https://97821998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FM2yV1foUgoGHBC66VBDw%2Fuploads%2F4WKRW49trlU4NiS7nUXJ%2Fdate-and-time-fields--date-settings.jpg?alt=media)

In the **Validation** panel:

| Setting                   | What it does                                                                                            |
| ------------------------- | ------------------------------------------------------------------------------------------------------- |
| **Required**              | The form can't be sent without a value.                                                                 |
| **Earliest**              | The first date or time that can be picked. Earlier ones are greyed out in the calendar and refused.     |
| **Latest**                | The last date or time that can be picked.                                                               |
| **Minutes between times** | Time fields only. For example `15` allows 09:00, 09:15, 09:30 and so on. Leave it empty for any minute. |

**Earliest** and **Latest** take:

| You type                                                                | Means                                                                                                                                                                                                            |
| ----------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `2026-12-31` (date), `09:00` (time), `2026-12-31T09:00` (date and time) | A fixed value. Use this format, whatever date format your site shows.                                                                                                                                            |
| `today`                                                                 | Today, in your site's time zone (**Settings → General**). Date and Date and time fields only.                                                                                                                    |
| `today+1`, `today+90`, `today-1`                                        | That many days from today. `today+1` = from tomorrow; `today+90` = up to three months ahead.                                                                                                                     |
| `pickup_date`                                                           | The **Field Name** of another date field in the form. The calendar of this field starts at the date picked there, so a return date can't come before the pick-up date. A Time field can name another time field. |
| `{{post.…}}` and other page tags                                        | Filled in when the page is shown, like in any other field setting. See [Dynamic Tags and Variables](/documentation/form-building/create-form/dynamic-tags-and-variables.md).                                     |

`today` is worked out again in the visitor's browser, so a page served from a cache still starts at the right day. When the form is sent, your server checks the same rules, with one day's leeway for `today` so a visitor in another time zone isn't refused at midnight.

![The settings of a Time field: Earliest 09:00, Latest 17:00, 15 minutes between times](https://97821998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FM2yV1foUgoGHBC66VBDw%2Fuploads%2FZpZl47Iq3b2zfnfoXHbr%2Fdate-and-time-fields--time-settings.jpg?alt=media)

The **Placeholder** has no effect on these fields: the browser shows its own empty pattern, such as `dd/mm/yyyy`.

### What your visitor sees

The browser's own picker: a calendar for dates, a clock or a list for times, both for **Date and time**. How it looks and the order of day and month follow the visitor's device and language. Dates outside **Earliest** and **Latest** can't be picked.

If a value breaks a rule, the field gets a message when the form is sent:

![Error messages: the return date must be on or after the pick-up date, and the time must be on a quarter hour](https://97821998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FM2yV1foUgoGHBC66VBDw%2Fuploads%2FJzOe3MHoEstDOJPMO7iW%2Fdate-and-time-fields--earliest-error.jpg?alt=media)

* *The Return date must be November 20, 2026 or later.* (from **Earliest**)
* *…or earlier.* (from **Latest**)
* For **Minutes between times**, the browser's own message, for example *Please enter a valid value. The two nearest valid values are 10:00 and 10:15.*

To word the **Required**, **Earliest** and **Latest** messages yourself, use the **Validation Messages** panel of the field.

### How the value is saved

Values are sent and saved in one fixed format, whatever the visitor's device shows:

| Field             | Saved as           |
| ----------------- | ------------------ |
| **Date**          | `2026-11-20`       |
| **Time**          | `10:15`            |
| **Date and time** | `2026-11-20T10:15` |

**CraftForms → Submissions**, emails and PDFs show them the way your site shows dates and times (**Settings → General**): *November 20, 2026*, *10:15 am*.

![A submission showing the dates and time in the site's own format](https://97821998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FM2yV1foUgoGHBC66VBDw%2Fuploads%2FfWM21AvWjlrphLPhsWr3%2Fdate-and-time-fields--submission.jpg?alt=media)

Conditions, formulas and webhooks get the saved format (`2026-11-20`), which sorts and compares correctly.

### Good to know

* The date has no time zone attached: it is the date the visitor picked. **Date and time** is the visitor's local time, saved as typed.
* `today` in **Earliest** of a **Date and time** field means today at 00:00.
* A date field that names another field in **Earliest** or **Latest** has no limit until that field has a value.
* Imported forms: dates and times from Gravity Forms, WPForms and Fluent Forms become these fields.
* The old **Datepicker Field** page in this documentation points to the booking calendar. For a simple date, use the **Date** field described here.
