Come creare un modulo WordPress con un selezionatore di date (in modo semplice)

Volete creare un modulo WordPress con un selezionatore di date?

Un campo di selezione della data è un modo comodo per acquisire informazioni relative alla data nei vostri moduli WordPress. Ad esempio, potreste aver bisogno di conoscere la data di nascita dei vostri utenti, oppure volete che possano facilmente fissare un appuntamento per i vostri servizi attraverso i vostri moduli.

In questo articolo vi mostreremo come creare facilmente un modulo WordPress con un selezionatore di date.

Perché creare un modulo WordPress con un selezionatore di date?

Un campo di selezione della data in un modulo di WordPress è utile quando si desidera che gli utenti inseriscano delle date. Esempi comuni sono:

• Moduli di registrazione che chiedono agli utenti di inserire la data di nascita.
• Moduli d’ordine per scegliere la data e l’ora di consegna di un ordine.
• Moduli di noleggio per selezionare una data di ritiro o di riconsegna di un articolo a noleggio.
• Moduli di richiesta di richiamo per consentire agli utenti di comunicarvi quando desiderano essere contattati per i vostri prodotti o servizi.
• Moduli di richiesta di congedo per consentire ai dipendenti di inserire le date di inizio e fine delle ferie.
• Moduli per appuntamenti o prenotazioni per siti web di alloggi o servizi.

Un campo di inserimento della data è un modo molto più semplice per gli utenti di inserire le date rispetto a digitarle manualmente. Assicura che il formato della data rimanga coerente in tutti i moduli inviati, riducendo gli errori e migliorando l’esperienza dell’utente.

Detto questo, vediamo come creare facilmente un modulo WordPress con un selezionatore di date. Potete utilizzare questi collegamenti rapidi per navigare in questo articolo:

Passo 1: Installare il plugin WPForms e scegliere un modello

Il primo passo è installare WPForms. Si tratta del miglior plugin per moduli di contatto WordPress sul mercato, che rende super facile la creazione di tutti i tipi di moduli WordPress sul vostro sito web, compresi i moduli con campi di selezione della data.

Per istruzioni dettagliate, potete consultare la nostra guida passo-passo su come installare un plugin di WordPress.

Per maggiori dettagli, potete consultare la nostra recensione completa di WPForms.

Dopo l’attivazione, andate alla pagina WPForms ” Aggiungi nuovo dalla vostra dashboard di WordPress.

In questo modo si accede alla pagina “Seleziona un modello”.

Prima di scegliere un modello, è una buona idea dare un nome al vostro modulo WordPress, in modo da poterlo identificare facilmente in seguito.

Scendendo verso il basso, si troveranno numerosi template di moduli già pronti, molti dei quali includono già il campo dell’intervallo di date.

A titolo di esempio, utilizzeremo il modello Simple Contact Form e vi aggiungeremo il campo di selezione della data. Ma sentitevi liberi di scegliere il modello che più vi aggrada.

Una volta effettuata la scelta, è sufficiente fare clic sul pulsante “Usa modello”.

Passo 2: Aggiungere un campo di selezione della data al modulo WordPress

Ora si arriva al costruttore di moduli di WPForms. Noterete le opzioni di campo nella colonna di sinistra e l’anteprima del modulo sul lato destro dello schermo.

Per impostazione predefinita, il modello di modulo di contatto semplice contiene solo i campi nome, indirizzo e-mail e commenti.

A scopo dimostrativo, vi mostreremo come aggiungere un campo data al vostro modulo WordPress. Ma se il vostro template lo contiene già, potete passare alla parte di modifica di questo passo.

È necessario scorrere verso il basso fino alla sezione Campi fantasia nella colonna di sinistra, dove si trova il campo “Data/ora”.

È sufficiente trascinare e rilasciare il campo nel punto desiderato del modulo. In questa esercitazione, lo abbiamo posizionato proprio sotto il campo Email.

Una volta fatto ciò, fare clic sul campo “Data/ora” per modificarlo. Si aprirà la scheda “Opzioni campo” sul lato sinistro dello schermo.

Da qui è possibile modificare l’etichetta del campo, che per impostazione predefinita è “Data/ora”. Per il nostro campo utilizzeremo “Ora preferita per la telefonata”.

È inoltre possibile modificare il formato della data del campo utilizzando il menu a discesa Formato. Le opzioni sono Data e ora, Data o Solo ora. Questo può essere utile se si vuole usare solo una data senza un campo orario per raccogliere le date di nascita degli utenti.

A parte questo, è possibile compilare il testo della descrizione per fornire un contesto più ampio su ciò che l’utente deve inserire nel campo.

Infine, è possibile selezionare la casella ‘Richiesto’ se si desidera rendere questo campo obbligatorio. Ciò significa che l’utente dovrà selezionare una data e un’ora prima di poter inviare il modulo.

Una volta fatto ciò, basta fare clic sul pulsante “Salva” in alto per memorizzare le impostazioni del modulo.

Passo 3: Configurare le opzioni avanzate per il selezionatore di data e ora

Di default, il campo di selezione dell’intervallo di date sul modulo WordPress sarà un calendario con un menu a discesa accanto.

Viene selezionata la data corrente, ma l’utente può modificarla per scegliere una data diversa. Il formato della data è mese/giorno/anno.

Nel frattempo, il menu a tendina dell’ora è impostato su un orologio a 12 ore con intervalli di 30 minuti.

Gli utenti possono quindi scegliere la fascia oraria più adatta a loro.

In alcuni casi, è possibile modificare le impostazioni del selezionatore di data. Ad esempio, è possibile che il proprio Paese segua i formati di data e ora giorno/mese/anno o 24 ore piuttosto che quelli predefiniti.

Per farlo, è necessario passare alla scheda “Avanzate” nella parte superiore del pannello di sinistra.

Qui è possibile regolare le dimensioni del campo di selezione della data. Poi, nella sezione Data, è possibile modificare l’intervallo di date da un calendario a un menu a discesa.

La sostituzione del selezionatore di date con un menu a discesa è una buona idea se il modulo ha uno spazio limitato e il calendario appare piuttosto piccolo.

Ecco come appare il menu a discesa della data:

In basso, è possibile modificare il formato della data da mese/giorno/anno (1/31/2024) a giorno/mese/anno (31/1/2024) o Mese Giorno, Anno (31 gennaio 2024).

Se si sceglie il selezionatore di date del calendario, è possibile inserire un testo segnaposto nel campo ‘Data’. Si può inserire il formato della data per far sapere agli utenti quale formato si sta utilizzando, in modo che non si confondano.

Inoltre, è possibile attivare l’interruttore “Limita giorni” per regolare l’intervallo di date selezionabili. Questo è utile se i servizi vengono eseguiti solo nei giorni feriali.

È possibile anche disattivare le date passate per evitare che vengano selezionate le date precedenti.

Passiamo quindi alla sezione “Ora” per modificare il selezionatore dell’ora.

Qui è possibile modificare l’intervallo in 15 minuti o 1 ora invece di 30 minuti. È anche utile inserire qui un testo segnaposto per indicare il formato dell’ora che si sta utilizzando.

Per impostazione predefinita, il selezionatore dell’ora è un orologio a 12 ore, ma è possibile passare a un orologio a 24 ore se si preferisce.

È inoltre gratuito attivare l’impostazione “Limita orari” per specificare gli orari di inizio e fine dei servizi. In questo modo, gli utenti non potranno fissare un appuntamento al di fuori del vostro orario di lavoro.

Oltre a questo, è possibile inserire un nome di classe CSS per il campo dell’intervallo di date. Si tratta di una caratteristica avanzata e facoltativa, ma si può usare per sovrascrivere lo stile del modulo usando il codice in un secondo momento.

Infine, se necessario, è possibile nascondere l’etichetta e/o la sottoetichetta del campo del modulo.

Una volta soddisfatti del nuovo modulo, è possibile salvarlo facendo clic sul pulsante “Salva” in alto a destra nella schermata.

Passo 4: incorporare il modulo di WordPress nel vostro sito web

Ora siete pronti ad aggiungere il vostro nuovo modulo con il selezionatore di date al vostro sito web WordPress. Per farlo, basta cliccare sul pulsante “Incorpora” in alto nel builder del modulo.

Apparirà un popup che chiede di selezionare una pagina esistente a cui aggiungere il modulo o di creare una nuova pagina per il modulo da zero. Entrambe le opzioni utilizzano l’editor di blocchi, quindi i passaggi sono abbastanza simili.

Aggiungere il blocco WPForms a una pagina esistente o nuova

Per inserire il modulo in una pagina esistente, fare clic sul pulsante “Seleziona pagina esistente”. Successivamente, selezionate una delle pagine già presenti sul vostro blog o sito web WordPress e fate clic su “Andiamo!”.

Se si desidera aggiungere il modulo a una nuova pagina, è sufficiente fare clic sul pulsante “Crea nuova pagina”.

Quindi, date un nome alla vostra nuova pagina e fate clic su “Let’s Go!”.

Entrambi i metodi portano all’editor a blocchi, dove si vedranno alcune istruzioni su come add-on il blocco WPForms.

Per prima cosa, fare clic sul pulsante “+” per aggiungere un blocco.

Quindi, digitate “WPForms” nella barra di ricerca del blocco.

È sufficiente trascinare e rilasciare il blocco nel punto migliore della pagina.

A questo punto è sufficiente fare clic sul menu a discesa.

Quindi, selezionare il modulo appena creato.

Nella barra laterale delle impostazioni del blocco, è possibile personalizzare gli stili dei campi, delle etichette e dei pulsanti del modulo per renderli più gradevoli con il proprio tema WordPress.

È possibile modificare le dimensioni, il raggio del bordo e i colori di ciascun elemento.

Ora è possibile fare clic sul pulsante “Aggiorna” o “Pubblica” per rendere il modulo attivo sul sito web.

Sul vostro sito web WordPress dovrebbe avere un aspetto simile a questo:

Se si desidera inserire il modulo widget in un post piuttosto che in una pagina, è possibile creare un nuovo post o aprirne uno esistente nell’editor a blocchi.

Dopodiché, basta seguire gli stessi passi per aggiungere il blocco WPForms a una pagina, come in questo metodo.

Aggiungere il blocco WPForms a un’area pronta per i widget

Se utilizzate un tema classico di WordPress, potreste voler visualizzare il modulo in un’area dell’intestazione, del piè di pagina o della barra laterale predisposta per i widget. Questa può essere una buona idea se il modulo è piuttosto breve e non occupa troppo spazio.

Nota: se si utilizza un tema a blocchi, questo metodo non funzionerà per il sito web.

Per farlo, basta andare su Aspetto “ Widget dall’area di amministrazione di WordPress. Quindi, navigare nell’area pronta per il widget desiderato e fare clic sul pulsante bianco ‘+’ per aggiungere un blocco al suo interno. Successivamente, è possibile cercare il blocco WPForms.

Se vengono visualizzate due opzioni, è possibile sceglierne una o l’altra, poiché entrambe svolgono la stessa funzione.

Come nel metodo precedente, basta selezionare il modulo appena creato. Nella barra laterale delle impostazioni del blocco, è possibile configurare il design in modo che si adatti meglio al tema di WordPress.

Una volta soddisfatti delle modifiche, è sufficiente fare clic sul pulsante “Aggiorna”.

Ecco fatto!

Ecco come appare il nostro modulo in fondo a un blog WordPress:

Incorporate il vostro modulo WordPress con uno shortcode

Se il blocco o il widget WPForms non funzionano, è possibile aggiungere il modulo di WordPress utilizzando uno shortcode.

Nel popup “Incorpora in una pagina”, è sufficiente fare clic sul link “Usa un codice breve”. Verrà visualizzato un codice breve che è possibile copiare e incollare in una pagina, in un post o in un’area pronta per i widget.

Per ulteriori informazioni su come utilizzare gli shortcode, leggete il nostro articolo su come aggiungere uno shortcode in WordPress.

Suggerimenti per ottimizzare il vostro modulo WordPress

Ora che sapete come aggiungere un campo per la selezione della data ai vostri moduli, vediamo i migliori suggerimenti per portare i vostri moduli a un livello superiore:

• Inviate e-mail di conferma a chi ha inviato il modulo : in questo modo gli utenti riceveranno una notifica di avvenuta ricezione dell’iscrizione e non dimenticheranno la data o l’ora che hanno scelto.
• Accettate pagamenti online nei vostri moduli – WPForms supporta i più diffusi gateway di pagamento come Stripe, PayPal, Square e Authorize.net. È possibile raccogliere pagamenti una tantum o ricorrenti e non ci sono spese di transazione aggiuntive.
• Rendere conversazionali i moduli più lunghi – Se avete un modulo di registrazione di un evento o di un utente che deve acquisire molte informazioni, renderlo conversazionale può aumentare il tasso di completamento del modulo.
• Prevenzione dello spam nei moduli di contatto – È possibile attivare la protezione anti-spam integrata di WPForms e la casella di controllo reCAPTCHA per filtrare le voci dei moduli contenenti spam.
• Creare moduli multilingue – Raggiungete un pubblico eterogeneo e aumentate l’accessibilità del vostro sito web con moduli che si visualizzano in più lingue.
• Seguite il nostro elenco di best practice per la progettazione di moduli di contatto – Questa guida vi guida nella progettazione del miglior modulo WordPress per convertire i normali visitatori in clienti o lead.
• Leggete tutta la nostra guida sulla creazione di moduli interattivi: il cofondatore di WPForms Jared Atchison vi dà indicazioni su come rendere i moduli più coinvolgenti, dall’uso della logica condizionale all’aggiunta di contenuti multimediali.

Speriamo che questo articolo vi abbia aiutato a imparare come creare un modulo WordPress con un selezionatore di date. Potreste anche voler dare un’occhiata al nostro articolo su come creare un modulo multi-pagina in WordPress e al nostro elenco definitivo dei migliori plugin per sondaggi in WordPress.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.