Date and Time Options in Magento 2

Date and Time Options in Magento 2

This tutorial blog will explain how to add a date and time picker with a custom format to the Magento 2 system configuration. If you missed our earlier article about Magento, you can find it here. Downloadable Product Options in Magento 2

Moreover, see our relevant article – Magento 2 Tutorials

What is the Date and time custom option?

Using this option, you can customize the date and time format; you can also choose the input control already used for any data entry. The value of dates can be selected from a popup calendar or dropdown menu list.

How to configure date and time custom options?

• Step 1: Log in to the Magento admin panel.
• Step 2: Go to Store > Configuration.
• Step 3: Select Catalog underneath Catalog.
• Step 4: Click on the Date & Time Custom Options.
• Step 5: Use JavaScript Calendar:- Determines whether or not date fields' input controls use the JavaScript calendar. Preferences: Yes or No.
  If it is set to Yes, you can use the popup calendar for date fields.
  If it is set to No, each component of the date field has its own dropdown menu.
• Step 6: Date Fields Order:- Determines the hierarchy of the three date fields. Options: Day, Month, and Year.
  Change the field values and format according to your requirement. For example, DD/MM/YY or MM/DD/YY.
• Step 7: Time Format:- It allows you to change the time format to either a twenty-four or twelve-hour clock. Options: 12h AM/PM / 24h.
  Select either the 12-hour or 24-hour format from the dropdown menu.
• Step 8: Year Range:- Sets the start and end range for the years that are available in the dropdown Year field. The value needs to be typed in as YYYY.
  To set the from and to dates for the year range in the dropdown, enter the year. The current year is used as the default value if this field is left empty.
• Step 9:Click on the save config once you've finished.