### [Como Personalizar as Opções de Data do Campo Data e Hora](https://wpforms.com/developers/customize-the-date-time-field-date-options/)
**Publicado:** 26 de fevereiro de 2021
**Autor:** Umair Majeed
**Resumo:** Este tutorial apresentará vários exemplos diferentes sobre como personalizar os campos de formulário Seletor de Data e Dropdown de Data.
**Conteúdo:**
Gostaria de personalizar as opções de data do campo de data e hora no WPForms? O campo **Data / Hora** inclui duas opções de formato para o seletor de data: **Seletor de Data**, que fornece ao usuário um calendário, ou **Dropdown de Data**.
Com o lançamento da versão 1.6.3, o WPForms oferece opções dentro do construtor de formulários para **Limitar Dias** e até mesmo **Desativar Datas Passadas**, bem como **Limitar Horas**. Se é tudo o que você precisa fazer, [revise esta documentação](https://wpforms.com/docs/how-to-limit-options-for-the-date-time-field/ "Como Limitar Opções para o Campo Data / Hora").
Este tutorial se concentrará mais na personalização do campo **Dropdown de Data** e no cálculo de blocos de datas para o **Seletor de Data**.
É importante lembrar que, se você estiver usando **qualquer um** dos trechos de código neste documento, as opções do construtor de formulários para limitação devem ser desativadas. Para saber mais sobre as opções integradas para limitar as datas, [consulte esta documentação](https://wpforms.com/docs/how-to-limit-options-for-the-date-time-field/#limit-date).
## Criação do formulário
Antes de adicionar quaisquer trechos, você precisará criar seu formulário e adicionar seus campos. Como este tutorial é baseado no campo **Dropdown de Data**, você precisará adicionar pelo menos um campo **Data**.
Se precisar de alguma assistência na criação do seu formulário, [consulte este tutorial](https://wpforms.com/docs/creating-first-form/ "Como Personalizar as Opções de Data do Campo Data e Hora").
Depois de adicionar seus campos de data, certifique-se de ter selecionado o **Tipo** para **Dropdown de Data**. Você pode definir o **Tipo de Data** clicando nas opções **Avançadas** do campo do formulário.
## Personalização do campo de Data
Para personalizar o campo **Data**, você precisará adicionar um dos trechos de código abaixo ao seu site.
Se precisar de ajuda para aprender como adicionar trechos de código ao seu site, [revise este tutorial](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/ "Como Adicionar PHP ou JavaScript Personalizado para WPForms").
Alguns dos trechos de código abaixo exigirão o uso de informações específicas de [ID do formulário e ID do campo](https://wpforms.com/developers/how-to-locate-form-id-and-field-id/ "Como Localizar ID do Formulário e ID do Campo").
## Usando trechos no Dropdown de Data
#### Limitando o número de dias no dropdown para corresponder ao mês
Para que o campo **Dias** coincida com a quantidade de dias disponíveis para aquele mês específico, você usaria este trecho.
```
/**
* Limita o dropdown de dias para corresponder a quantos dias estão disponíveis para o mês selecionado.
*
* @link https://wpforms.com/developers/customize-the-date-time-field-date-options/
*/
function wpf_dev_days_dropdown_match_month( ) {
?>
**Categorias:** Campos
**Tags:** Campo Data e Hora, Javascript, PHP
---