1. Home
  2. Snippets
  3. Create additional formats for the Date field date picker

Create additional formats for the Date field date picker

Heads up!

This article contains PHP code and is intended for developers. We offer this code as a courtesy, but don't provide support for code customizations or 3rd party development.

For extra guidance, please see WPBeginner's tutorial on adding custom code.

Dismiss

The Date / Time field’s date picker provides 3 different date formats to choose from. To select a date format, go to the form builder to click on the Date / Time field in the form preview area to open up the Field Options panel. In the Advanced Options section, click on the Format field to choose a date format.


Additional formats can be made available with a filter.

The snippet below adds a new format “Tuesday, 14th May 2019”. Please note that the PHP and JS date characters may be different, so refer to the links in the comments.

Lastly, all dates are also converted and stored in a UNIX time stamp (in addition to the readable format). Depending on the date format, it could affect the ability for PHP to create the UNIX time stamp correctly. In most cases this is not an issue, but still worth noting.

/**
 * Add additional formats for the Date field date picker.
 *
 * @param array $formats
 * @return array
 */
function wpf_dev_date_field_formats( $formats ) {

	// Item key is JS date character - see https://flatpickr.js.org/formatting/
	// Item value is in PHP format - see http://php.net/manual/en/function.date.php

	// Adds new format Tuesday, 14th May 2019
	$formats['l, J F Y'] = 'l, jS F Y';

	return $formats;
}
add_filter( 'wpforms_datetime_date_formats', 'wpf_dev_date_field_formats' );
Updated on May 22, 2019

Was this article helpful?