Last updated on September 25, 2023

ACF date and time field format customization

Don’t know where to add this snippet? Read our guide: How to add code snippets.

Customizing Date and Time Formats in ACF.

The ACF (Advanced Custom Fields) plugin in WordPress allows you to create custom fields for your posts, pages, or custom post types. One of the field types provided by ACF is the date and time field. By default, the date and time field in ACF uses the format “Y-m-d H:i:s” (e.g., 2022-01-01 12:00:00). However, you may want to customize the format of the date and time displayed or stored in the database.

To customize the format of the ACF date and time field, you can use the acf/format_value filter hook. This hook allows you to modify the value of an ACF field before it is displayed or saved.

Here’s an example code snippet that demonstrates how to customize the format of an ACF date and time field:

function wpsnippets_custom_date_format( $value, $post_id, $field ) {
    // Convert the value to a DateTime object
    $date = new DateTime( $value );

    // Customize the date format
    $formatted_date = $date->format( 'F j, Y' );

    // Return the formatted date
    return $formatted_date;
}
add_filter( 'acf/format_value/type=date_time', 'wpsnippets_custom_date_format', 10, 3 );

In this code snippet, we define a custom function wpsnippets_custom_date_format that accepts three parameters: $value (the current value of the field), $post_id (the ID of the post being edited), and $field (the ACF field object).

Inside the function, we create a new DateTime object using the $value parameter, which represents the current value of the ACF date and time field. We then use the format() method of the DateTime object to customize the date format. In this example, we use the format ‘F j, Y’, which will display the date as “Month Day, Year” (e.g., January 1, 2022).

Finally, we return the formatted date, which will be displayed in the ACF date and time field.

By using this code snippet and modifying the format in the format() method, you can customize the display format of the ACF date and time field to suit your needs.

Examples

Example 1: Customizing the date and time format in ACF date and time field

This example demonstrates how to customize the date and time format in an Advanced Custom Fields (ACF) date and time field. By default, ACF uses the format specified in the WordPress settings. However, you may want to display the date and time in a different format for a specific use case.

function wpsnippets_custom_date_format( $value, $post_id, $field ) {
    // Customize the date and time format
    $format = 'F j, Y g:i a';

    // Return the formatted date and time
    return date( $format, strtotime( $value ) );
}
add_filter( 'acf/format_value/type=date_time', 'wpsnippets_custom_date_format', 10, 3 );

In this code example, we define a custom function wpsnippets_custom_date_format that takes three parameters: $value, $post_id, and $field. We specify the desired date and time format using the $format variable. The date() function is then used to format the date and time value, which is passed through the strtotime() function to convert it to a Unix timestamp. Finally, we hook this custom function to the acf/format_value/type=date_time filter using the add_filter() function.

Example 2: Customizing the date format in ACF date and time field

This example demonstrates how to customize only the date format in an ACF date and time field. Sometimes, you may want to display the date in a specific format while keeping the default time format.

function wpsnippets_custom_date_format( $value, $post_id, $field ) {
    // Customize the date format
    $format = 'F j, Y';

    // Return the formatted date and default time
    return date( $format, strtotime( $value ) ) . ' ' . date( 'g:i a', strtotime( $value ) );
}
add_filter( 'acf/format_value/type=date_time', 'wpsnippets_custom_date_format', 10, 3 );

In this code example, we use the same custom function as in Example 1, but this time we modify the $format variable to only include the desired date format. We then use the date() function twice: once to format the date and once to format the default time. The two formatted values are concatenated using the . operator, and the result is returned.

Example 3: Customizing the time format in ACF date and time field

This example demonstrates how to customize only the time format in an ACF date and time field. There may be cases where you want to display the time in a specific format while keeping the default date format.

function wpsnippets_custom_time_format( $value, $post_id, $field ) {
    // Customize the time format
    $format = 'g:i a';

    // Return the default date and formatted time
    return date( 'F j, Y', strtotime( $value ) ) . ' ' . date( $format, strtotime( $value ) );
}
add_filter( 'acf/format_value/type=date_time', 'wpsnippets_custom_time_format', 10, 3 );

In this code example, we define a new custom function wpsnippets_custom_time_format that follows a similar structure as the previous examples. We modify the $format variable to specify the desired time format. The date() function is then used twice: once to format the default date and once to format the time. The two formatted values are concatenated using the . operator, and the result is returned.

Last updated on September 25, 2023. Originally posted on October 9, 2023.

Leave a Reply

Your email address will not be published. Required fields are marked *