Come creare un modulo DatePicker di WordPress

Volete creare un modulo WordPress con un selezionatore di date?

È semplicissimo aggiungere un selezionatore di intervalli di date in WordPress che i visitatori possono usare per selezionare data e ora in un modulo.

In questo articolo, quindi, vi mostreremo come aggiungere facilmente un campo modulo Date/Time Picker in WordPress, oltre ad alcuni suggerimenti per personalizzarlo.

Create ora il vostro modulo WordPress

Come creare un modulo WordPress con un selezionatore di date

Utilizzando WPForms, è semplicissimo aggiungere un campo che permetta di selezionare una data specifica, un'ora o entrambe.

Ecco un tutorial passo-passo su come creare un modulo WordPress con un selezionatore di data/ora:

Se preferite istruzioni scritte per aggiungere un selezionatore di date di WordPress ai vostri moduli, consultate i passaggi seguenti:

Passo 1: Creare un modulo WordPress

La prima cosa da fare è installare e attivare il plugin WPForms. È necessaria una versione a pagamento del plugin, poiché il campo Date/Time Picker non è disponibile nella versione gratuita. Per maggiori dettagli, consultate questa guida passo passo su come installare un plugin in WordPress.

Una volta acquistato e installato il plugin WPForms, andate su WPForms " Aggiungi nuovo per creare un nuovo modulo.

Nella schermata di configurazione, date un nome al vostro modulo e selezionate il modello di modulo che volete utilizzare. Il bello è che WPForms è dotato di oltre 2.000 modelli di moduli WordPress.

Nel nostro esempio, utilizzeremo il modello Simple Contact Form.

Ora personalizziamo questo modulo e aggiungiamo il campo di selezione della data.

Passo 2: Aggiungere il selezionatore di date al vostro modulo WordPress

È possibile aggiungere campi aggiuntivi al modello di modulo selezionato utilizzando il semplice editor drag-and-drop di WPForms.

Quindi andiamo avanti e trasciniamo il campo Data/Ora nel modulo, dove vogliamo.

Una volta inserito nel modulo, è possibile trascinarlo verso l'alto e verso il basso per posizionarlo in un altro punto e fare nuovamente clic sul campo per aprire le impostazioni e personalizzarlo.

Quando si fa clic sul campo del modulo Data/ora, vengono visualizzate le seguenti opzioni:

• Etichetta: È il titolo del campo che i visitatori del sito vedranno nel modulo.
• Formato: Scegliere se questo campo deve includere sia la data che l'ora, solo la data o solo l'ora.
• Descrizione: Aggiungere una descrizione per il campo. Questo è un buon punto per aggiungere istruzioni o dettagli per gli utenti.
• Richiesto: Attivare questo pulsante per impedire agli utenti di inviare il modulo finché il campo non è compilato.

Se si scorre verso il basso e si fa clic su Opzioni avanzate, è possibile personalizzare ulteriormente il campo Data/ora, come illustrato di seguito.

Passo 3: Personalizzazioni avanzate del selezionatore di date di WPForms

Per impostazione predefinita, il campo di selezione della data in WPForms è impostato sul formato di visualizzazione del calendario.

I formati del campo Data/Ora possono essere facilmente modificati in WPForms. A tale scopo, fare clic sulla scheda Avanzate sotto Opzioni campo. Quindi, è possibile personalizzare le seguenti opzioni:

• Tipo: È possibile scegliere tra Date Picker (la vista calendario predefinita) o Date Dropdown (aggiunge campi a discesa separati per il mese, la data e l'anno).
• Formato: Qui è possibile selezionare diversi formati di data (m/d/a o d/m/a).
• Limita giorni: Attivare questa opzione per selezionare i giorni della settimana che gli utenti possono scegliere.
• Disattiva date passate: Con questa opzione è possibile impedire agli utenti di selezionare le date passate.

Vediamo ora le opzioni di personalizzazione per la sezione Tempo del campo Data/Ora in WPForms.

Passo 4: Personalizzazioni avanzate del campo orario di WPForms

Analogamente alle impostazioni del selezionatore di date, è possibile personalizzare le opzioni per la sezione Ora del campo Data/Ora.

Per impostazione predefinita, il formato dell'ora è impostato su un orologio a 12 ore con intervalli di 30 minuti:

Come in precedenza, è possibile modificare le impostazioni del campo Tempo accedendo alla scheda Avanzate in Opzioni campo. Ecco come appaiono queste impostazioni:

• Intervallo: WPForms consente di scegliere tra intervalli di 15 minuti, 30 minuti e 1 ora per il campo Orario.
• Formato: Consente di scegliere tra un orologio a 12 ore o a 24 ore.
• Limitare le ore: Definire l'intervallo di tempo che gli utenti possono selezionare.

Qualunque sia il formato scelto, sappiate che il campo Date/Time Picker è un ottimo modo per ottenere dati precisi nei vostri moduli. La data sarà sempre convalidata e nel formato corretto all'interno del campo Date/Time Picker.

Volete che qualcuno compili il vostro modulo Date/Time Picker solo una volta? Se volete vedere come limitare le iscrizioni degli utenti, date un'occhiata a questo tutorial su come limitare il numero di iscrizioni ai moduli di WordPress.

Una volta terminata la personalizzazione delle impostazioni, fare clic su Salva.

Passo 5: Configurare le impostazioni del modulo Date Picker

Le conferme del modulo sono messaggi che vengono visualizzati dagli utenti una volta completato il modulo. Le conferme consentono di sapere che il modulo è stato elaborato e offrono la possibilità di indicare i passi successivi da compiere.

WPForms offre 3 tipi di conferma tra cui scegliere:

1. Messaggio: È il tipo di conferma predefinito in WPForms. Quando un visitatore del sito invia il modulo, apparirà un semplice messaggio per informarlo che il modulo è in fase di elaborazione.
2. Mostra pagina: Questo tipo di conferma porta i clienti a una pagina web specifica del vostro sito, ringraziandoli per aver compilato il modulo Date/Time Picker e dicendo loro cosa devono fare dopo. Per un aiuto in tal senso, consultate il nostro tutorial sul reindirizzamento dei clienti a una pagina di ringraziamento.
3. Vai all'URL (reindirizzamento): Questa opzione serve quando si desidera inviare le persone a una pagina specifica contenente informazioni correlate che si trovano su un altro sito web.

Vediamo quindi come impostare una semplice conferma del modulo in WPForms, in modo da poter personalizzare il messaggio che gli utenti vedranno quando invieranno il modulo Date/Time Picker.

Per iniziare, fare clic sulla scheda Conferma nell'editor del modulo, alla voce Impostazioni.

Quindi, personalizzare il messaggio di conferma a proprio piacimento e fare clic su Salva.

Per informazioni su altri tipi di conferma, consultare la documentazione sull'impostazione delle conferme dei moduli.

Ora impostiamo le notifiche del modulo.

Passo 6: Configurare le notifiche del modulo

Volete che la data e l'ora in cui qualcuno compila i vostri moduli vi venga inviata subito in un'e-mail? Impostiamo le notifiche dei vostri moduli in modo che facciano proprio questo.

Le notifiche sono un ottimo modo per inviare automaticamente e-mail a voi stessi, ai vostri dipendenti e alla persona che ha compilato il modulo.

A meno che non si disabiliti questa funzione, ogni volta che qualcuno invia un modulo sul vostro sito, riceverete una notifica al riguardo.

Se si utilizzano gli Smart Tag, è possibile ricevere solo la data e l'ora nelle notifiche dei moduli.

A tal fine, è sufficiente aggiungere un timestamp nell'e-mail di notifica utilizzando questo tag intelligente - {date format="m/d/Y"}.

Ottimo lavoro! Ora siete pronti ad aggiungere il modulo Date/Time Picker al vostro sito web.

Passo 7: Aggiungere il modulo WordPress Date Picker al vostro sito

WPForms consente di aggiungere i moduli in varie posizioni, dai post del blog alle pagine, dal piè di pagina alla barra laterale.

Vediamo l'opzione più comune: incorporare il modulo in un post o in una pagina.

Fare clic sul pulsante Incorpora in alto a destra del costruttore di moduli.

Quindi, fare clic su Crea nuova pagina.

Date un nome alla vostra pagina e selezionate Let's Go.

In questo modo si accede all'editor di blocchi di WordPress per una nuova pagina con il modulo già incorporato. Premete Pubblica per utilizzare il vostro nuovo modulo WordPress per la selezione della data.

Congratulazioni! Il vostro modulo con un selezionatore di date è ora pubblicato.

Ed ecco fatto! Ora sapete come aggiungere un modulo WordPress con un selezionatore di date al vostro sito web.

Successivamente, provate i modelli di moduli aziendali

Se volete accelerare il processo di creazione dei moduli, ecco alcuni modelli di moduli aziendali che possono aiutarvi.

Si consiglia di consultare anche la nostra guida sulla personalizzazione del modulo di reimpostazione della password di WordPress.

Create ora il vostro modulo WordPress

Quindi, cosa state aspettando? Iniziate oggi stesso a utilizzare il più potente plugin per moduli WordPress.

E non dimenticate che se questo articolo vi è piaciuto, seguiteci su Facebook e Twitter.