Vuoi aggiungere un date picker al tuo modulo di contatto? Un date picker è necessario quando vuoi che i tuoi utenti selezionino una data e un'ora nel modulo.
In questo articolo, ti mostreremo come creare un modulo WordPress con un date picker.
Quando e perché dovresti aggiungere un date picker nei moduli WordPress?
Molti moduli di contatto hanno campi semplici come nome, email, telefono e messaggio. Queste informazioni sono sufficienti per entrare in contatto con i tuoi utenti. Tuttavia, se vuoi programmare un appuntamento con i tuoi utenti, allora dovrai aggiungere un date picker al tuo modulo.
Se stai gestendo un negozio eCommerce e vuoi che i clienti aggiungano la loro data di disponibilità per la consegna, allora puoi aggiungere un campo data e ora nel modulo di contatto o d'ordine.
Ci sono molte altre ragioni per cui potresti aver bisogno di chiedere ai tuoi utenti di inviare date e orari insieme alle loro informazioni di base. Vediamo come creare facilmente un modulo WordPress con un date picker.
Creare un modulo WordPress con un date picker
La prima cosa che dovrai fare è installare e attivare il plugin WPForms. Per maggiori dettagli, consulta la nostra guida passo passo su come installare un plugin WordPress.
Dopo l'attivazione, dovrai andare alla pagina WPForms » Aggiungi Nuovo per creare un modulo in WordPress. Si aprirà la schermata di configurazione di WPForms dove troverai diversi modelli predefiniti per creare facilmente un nuovo modulo a tua scelta. Puoi anche selezionare un modulo vuoto per iniziare da zero.
Per iniziare, scegliamo il modello Modulo di contatto semplice.
Verrà caricato un modulo di contatto semplice con i campi base nome, email, commento, ecc. Puoi vedere altri campi sul lato sinistro e un'anteprima del tuo nuovo modulo sul lato destro dello schermo. Trascina e rilascia semplicemente qualsiasi campo dal lato sinistro nel tuo nuovo modulo sul lato destro.
Poiché vuoi aggiungere un date picker, dovrai trascinare e rilasciare il campo Data / Ora dalla colonna di sinistra sul tuo modulo. Puoi posizionare il date picker sopra o sotto qualsiasi campo nel modulo WordPress.
Il modulo è completamente flessibile, il che significa che puoi facilmente riorganizzare l'ordine dei campi o personalizzare qualsiasi campo dalla sezione di anteprima del tuo modulo sul lato destro.
Una volta cliccato su qualsiasi campo nell'anteprima del modulo, verranno visualizzate le impostazioni sul lato sinistro per quel campo specifico. Ad esempio, se fai clic sul campo Data / Ora che hai appena aggiunto al tuo modulo, vedrai queste impostazioni per personalizzarlo:
- Etichetta: È il titolo del campo Data / Ora nel tuo modulo.
- Formato: In questo menu a discesa, puoi selezionare un formato per la data, l'ora o entrambi.
- Descrizione: Ti permette di aggiungere istruzioni per gli utenti sotto il campo.
- Obbligatorio: Se selezioni questa opzione, un utente non potrà inviare il modulo senza selezionare una data / ora in questo campo.
Oltre a queste impostazioni di base, ci sono opzioni avanzate per personalizzare il design e lo stile del campo data / ora.
Alcune delle opzioni avanzate includono:
- Dimensione campo: Sono disponibili diverse dimensioni di visualizzazione per il campo data/ora.
- Data: È un segnaposto. Il testo che aggiungerai qui verrà visualizzato per impostazione predefinita agli utenti. Accanto ad esso, puoi anche selezionare il formato per la data.
- Tipo: Puoi selezionare un tipo per il selettore di data. Ci sono 2 tipi: Selettore di data e Menu a discesa data
- Ora: Questo è un altro segnaposto per l'ora. Potresti anche dover scegliere un formato tra 12 ore o 24 ore.
Ci sono molte altre impostazioni personalizzate come intervallo, nascondi etichette e altro.
Dovresti anche consultare questa guida su come aggiungere CSS personalizzato al tuo modulo per istruzioni più dettagliate.
Assicurati di fare clic sul pulsante Salva per memorizzare le modifiche.
Impostazioni di conferma e notifiche
Una volta soddisfatto dei campi, dovrai gestire le impostazioni di conferma e le notifiche e-mail per il tuo modulo. Visita semplicemente la pagina Impostazioni » Conferma nel builder di WPForms. Da lì, puoi aggiungere un messaggio personalizzato per i tuoi utenti che riceveranno dopo l'invio del modulo. Puoi anche cambiare il tipo di conferma per reindirizzare gli utenti a una pagina di ringraziamento.
Successivamente, puoi andare alla pagina Impostazioni » Notifiche per gestire le notifiche e-mail per l'invio dei moduli. Puoi anche inviare più notifiche a diversi indirizzi e-mail.
Per impostazioni avanzate, puoi aggiungere logica condizionale al tuo modulo per inviare notifiche specifiche agli utenti. Ciò significa che, in base alle opzioni selezionate dall'utente, puoi inviare loro diverse notifiche e-mail automatiche.
Scopri di più qui: Come impostare le notifiche e le conferme corrette del modulo.
Infine, dovrai fare clic sul pulsante Salva per vedere il tuo modulo di contatto in azione.
Visualizza il modulo sul tuo sito WordPress
Puoi aggiungere il nuovo modulo che hai appena creato con un selettore di data a WordPress molto facilmente con WPForms. Ti mostreremo come farlo utilizzando l'editor a blocchi e l'editor classico. Ti mostreremo anche come aggiungerlo a una barra laterale.
Aggiungi modulo WordPress a pagina o post WordPress (Gutenberg)
Per aggiungere il modulo a qualsiasi pagina o post di WordPress, puoi cercare il blocco WPForms e aggiungerlo all'editor di testo.
Quindi, vedrai un menu a discesa dove potrai selezionare il modulo di contatto che hai appena creato.
Dopo aver selezionato il modulo, vedrai l'anteprima nell'editor di testo. Per aggiungere il modulo di contatto al tuo sito, fai clic sul pulsante Pubblica nell'angolo in alto a destra.
Aggiungi modulo WordPress a pagina o post WordPress (Editor classico)
Se utilizzi l'editor classico di WordPress, puoi aggiungere il modulo utilizzando il pulsante Aggiungi modulo. Oppure, puoi semplicemente copiare e incollare lo shortcode del modulo per incorporare il modulo sul tuo sito web.
Aggiungi modulo WordPress in una barra laterale
Puoi anche aggiungere il modulo al widget della barra laterale. Per fare ciò, vai su Aspetto » Widget. Ora, trascina e rilascia il widget WPForms nella barra laterale o nel menu piè di pagina a destra.
Dopo di che, seleziona il tuo modulo utilizzando il menu a discesa e salva le modifiche.
Una volta terminato, fai clic sul pulsante Salva. Il tuo modulo inizierà ora a essere visualizzato nella barra laterale del tuo sito web.
Tutto qui. Speriamo che questo articolo ti abbia aiutato a imparare come creare un modulo WordPress con un selettore di data. Potresti anche voler consultare la nostra guida su come creare un modulo di caricamento file in WordPress.
Commenti Lascia una risposta