How to create a partial date field in Drupal (i.e. Year & Month without Day)

Follow these steps to change the date’s output for your frontend:Let’s get right to it:

How to remove the time from a date field in Drupal

Date input with Year & Month

How to hide the time Drupal’s frontend

Here’s the end result! A date field which only requires inputting the Year & Month:

If the date format you’re looking for is not listed, you can create a new one:

  1. Structure > Content types > Your content type > Manage Display
  2. Select the appropriate display mode (e.g. “Default”, “Full”, or “Teaser”)
  3. Next, we will configure the date’s display
  4. If using the layout builder for this content type:
    • Select “Manage Layout”
       Manage layout button
    • If the date field is not yet present, press + Add Block then select the date field
    • Configure the date’s block as follows (to open the configure form, press the “gear” icon then press “Configure”
      Layout builder's contextual menu containing the
    •  
  5. If using the standard (non-layout builder) manage display:
    • Press the gear icon to the right of the date field
      Date field on Manage Display page, with gear icon to the right.
  6. Select the appropriate date format, if what you’re looking for is listed:
  7. Date format selector

How do I add a Date format to Drupal

While removing the time from Drupal’s forms isn’t too difficult, removing the day or month requires some custom code.

  1. Visit Manage > Configuration > Regional and language > Date and time formats
    • This typically takes you to: /admin/config/regional/date-time
  2. Select + Add Format
  3. Enter a name. For example, if you’re attempting to format dates like “May 2025”, a reasonable name may be “Month Year”.
  4. In Format String field, use PHP’s date format syntax to enter a date.
    • High-level summary of PHP’s date formats:
      • D for the abbreviated date of the week (e.g. Mon or Tue)
      • l (lowercase L) for the full day of the week (e.g. Monday or Tuesday)
      • j for the day of the month (e.g. 1 or 31)
      • F for the full name of the month (e.g. January or February)
      • n for the numeric month (e.g. 1 or 12)
      • M for the abbreviated name of the month (e.g. Jan or Dec)
      • Y for 4-digit year
      • y for 2-digit year
    • For example, entering M j, Y would display using the following format: “May 15, 2025”
  5. Save the format
  6. You may need to clear your website’s cache before the new date formats show up in the date field’s configuration form.

Hide the time input from Drupal forms

/**
 * Implements hook_form_alter().
 *
 * Remove “day” from field (field_date).
 */
function debug_academy_date_input_form_alter(&$form, FormStateInterface $form_state, $form_id) {
  // If node form which includes field_date.
  if (strpos($form_id, ‘node’) !== false && !empty($form[“field_date“])) {
    foreach ($form[“field_date“][‘widget’][0][‘value’][‘#date_part_order’] as $key => $value) {
      if ($value == ‘day‘) {
        // Remove “day” option from Issue date field.
        unset($form[“field_date“][‘widget’][0][‘value’][‘#date_part_order’][$key]);
      }
    }
  }
}

  1. Structure > Content types > Your content type > Manage Fields
  2. Select “Edit” next to the Date field
  3. Visit the “Field Settings” tab
  4. Under the “Date Type” dropdown, select “Date Only”
    • If this option is disabled, it means this field already has content entered and cannot be changed. You’ll either need to delete the existing values, or you can read on to learn a technique for hiding parts of the date using a custom module.
  5. That’s it!

How to remove the day or month from Drupal’s date form input

Experience the most efficient and effective path to a successful career in web development with Debug Academy. We have free Drupal training to help you get a sense of what’s possible in this field along with a more advanced curriculum. Learn about our Drupal certification training, Drupal migration services, and all the other Drupal courses we have to offer today!

There’s more to the picture and we would love to share it with you. If you’re serious about learning the skills required for web developer and want to speed up the process, you can trust Debug Academy. We’ll teach you the web developer required skills in a structured manner that helps you hit the ground running fast – and most importantly, with confidence!

  1. First, change your date field’s form widget from “Date and Time” to “Select list”
    1. Visit Structure > Content types > Your content type > Manage Form Display
    2. Next to your date field, choose “Select list” in the dropdown as shown here:
      Date form configuration
  2. Save your changes.
  3. Next up, it’s time to create a custom module! For this example, we’ll name the module debug_academy_date_input
    1. At a minimum, custom modules consists of:
      1. A folder: docroot/modules/custom/debug_academy_date_input/
      2. An info file: docroot/modules/custom/debug_academy_date_input/debug_academy_date_input.info.yml containing e.g.:
        • name: Date Input
          type: module
          core_version_requirement: ^9 || ^10 || ^11
  4. In your custom module, create a MODULENAME.module file, e.g.:
    • docroot/modules/custom/debug_academy_date_input/debug_academy_date_input.module
  5. I’ll assume your field’s machine name is field_date . Replace field_date in the following code with your date field’s machine name!
  6. Within debug_academy_date_input.module , write:
    <?phpuse DrupalCoreFormFormStateInterface;With personalized mentorship, collaborative projects, and a supportive community, Debug Academy is committed to transforming you into a proficient, job-ready web developer. 
  7. In the code above, replace all instances of “field_date” with your date field’s machine name
  8. In the code above, if you’d like to remove the month or year, simply repeat (or replace) this portion of the code – changing “day” to “month” or “year”:
          if ($value == 'day') {
            // Remove "day" option from Issue date field.
            unset($form["field_date"]['widget'][0]['value']['#date_part_order'][$key]);
          }
  9. Save your files, enable the module (via Manage > Extend), and clear your site’s cache.
  10. That should be it!

Because removing the time from date fields is such a common request, Drupal allows its removal without writing any custom code.

Removing the time input from Drupal’s date field is actually done through the field’s settings when creating the field. If the field does not yet have values stored, you can do the following to remove the time:

Become a skilled Web Developer with Tailored, Hands-On Training: Debug Academy

One of Drupal’s main strengths is its data modeling.

But sometimes choosing the appropriate field type comes with a form widget that isn’t what we’re looking for. For example, using a Date field results in the form displaying a date “widget” (form input) which includes a full date consisting of a day, month, and year, and optionally a time.

Fortunately, the date field has a highly configurable display on the frontend. By visiting the “Manage Display” page (or configuring the field’s block, if using layout builder), you will have the option of selecting (or creating) a date format.

Our approach blends structured learning with hands-on, real-world projects, guided by experienced professionals. Whether you’re a beginner or looking to upgrade your skills, our comprehensive curriculum covers everything from fundamental coding principles to advanced web technologies. 

Similar Posts