Contact Form 7: Validazione Campi, Messaggi di Errore e Conferma

La Importanza della Validazione nei Moduli di Contatto

La validazione dei campi e un aspetto fondamentale nella creazione di moduli di contatto professionali. Un modulo senza validazione adeguata rischia di raccogliere dati incompleti, errati o inutilizzabili, creando frustrazione sia per il proprietario del sito che per il visitatore. Contact Form 7 offre un sistema di validazione robusto che comprende campi obbligatori, controlli di formato, messaggi di errore personalizzabili e messaggi di conferma. In questa guida analizzeremo ogni aspetto della validazione, dalla configurazione base alle tecniche avanzate con espressioni regolari.

Una validazione ben configurata non solo migliora la qualita dei dati raccolti, ma contribuisce anche alla esperienza utente complessiva. Messaggi di errore chiari e precisi guidano il visitatore nella compilazione corretta del modulo, riducendo la frustrazione e aumentando il tasso di completamento.

Campi Obbligatori con il Simbolo Asterisco

Il metodo piu semplice per rendere un campo obbligatorio in Contact Form 7 e aggiungere il simbolo asterisco (*) dopo il tipo di tag. Quando un campo obbligatorio viene lasciato vuoto, il modulo non viene inviato e viene mostrato un messaggio di errore accanto al campo.

[text* your-name]      — campo testo obbligatorio
[email* your-email]    — campo email obbligatorio
[tel* your-phone]      — campo telefono obbligatorio
[textarea* your-msg]   — area di testo obbligatoria
[select* your-choice include_blank "Opzione A" "Opzione B"]  — menu obbligatorio

La regola generale e rendere obbligatori solo i campi strettamente necessari per gestire la richiesta. Come minimo, un modulo di contatto dovrebbe avere obbligatori il nome e la email. Tutti gli altri campi possono essere facoltativi per non scoraggiare il visitatore dalla compilazione.

Validazione del Formato dei Campi

Oltre alla obbligatorieta, Contact Form 7 esegue automaticamente la validazione del formato per alcuni tipi di campo:

Campo email: verifica che il valore contenga il simbolo @ seguito da un dominio valido. Se il visitatore inserisce un testo senza il formato corretto (ad esempio “mario” invece di “mario@esempio.it”), il modulo mostra un errore di formato.

Campo url: controlla che il valore abbia la struttura di un indirizzo web valido, con il protocollo (http:// o https://) e un dominio.

Campo number: accetta solo valori numerici e verifica che rientrino nella intervallo definito dai parametri min e max.

Campo date: verifica che la data sia nel formato corretto e che rientri nella intervallo definita.

Limiti di Lunghezza del Testo

Per i campi di testo e le textarea, puoi impostare limiti di lunghezza minima e massima:

[text* your-name minlength:2 maxlength:100]
[textarea* your-message minlength:20 maxlength:5000]

Il parametro minlength e particolarmente utile per il campo messaggio, dove un minimo di 20 caratteri garantisce che il visitatore scriva un messaggio significativo piuttosto che un singolo carattere o una parola casuale. Il parametro maxlength protegge il database e le email da messaggi eccessivamente lunghi.

La Scheda Messaggi — Personalizzare Ogni Comunicazione

La scheda Messaggi nel editor del modulo ti permette di personalizzare ogni singolo messaggio che Contact Form 7 mostra ai visitatori. Clicca sulla scheda per accedere alla lista completa dei messaggi configurabili.

Messaggio di Successo

Questo e il messaggio che appare quando il modulo viene inviato con successo. Il testo predefinito e “Grazie per il tuo messaggio. E stato inviato.” Puoi personalizzarlo con un messaggio piu dettagliato:

Grazie [your-name]! La tua richiesta e stata ricevuta con successo. Ti risponderemo entro 24 ore lavorative alla email [your-email]. Se hai necessita urgenti, contattaci al +39 06 1234567.

Un messaggio di successo dettagliato rassicura il visitatore e riduce la probabilita di invii doppi.

Messaggio di Errore di Invio

Questo messaggio appare quando il modulo non riesce a inviare la email, tipicamente per problemi del server. Il messaggio predefinito e generico, ma puoi renderlo piu utile:

Si e verificato un problema durante la invio del messaggio. Riprova tra qualche minuto. Se il problema persiste, contattaci direttamente alla email info@tuosito.it.

Messaggio di Errore di Validazione

Quando uno o piu campi non superano la validazione, Contact Form 7 mostra un messaggio generale in cima al modulo e messaggi specifici accanto ai singoli campi. Il messaggio generale predefinito e “Uno o piu campi hanno un errore. Controlla e riprova.” Puoi personalizzarlo:

Alcuni campi contengono errori. Controlla i campi evidenziati in rosso e correggi le informazioni prima di inviare nuovamente.

Lista Completa dei Messaggi Personalizzabili

Contact Form 7 offre la personalizzazione di numerosi messaggi specifici:

• Campo obbligatorio vuoto: “Questo campo e obbligatorio.” — Personalizza con un messaggio piu amichevole come “Per favore, compila questo campo per procedere.”
• Email non valida: “La email inserita non sembra essere valida.” — Puoi specificare: “Inserisci un indirizzo email nel formato nome@dominio.it”
• URL non valido: “La URL inserita non sembra essere valida.”
• Numero non valido: “Il numero inserito non e valido.”
• Numero troppo piccolo/grande: messaggi per valori fuori dal range impostato
• Data non valida: “La data inserita non e valida.”
• File troppo grande: “Il file caricato supera la dimensione massima consentita.”
• Tipo di file non consentito: “Il tipo di file caricato non e consentito.”
• Risposta quiz errata: “La risposta alla domanda non e corretta.”
• Accettazione non selezionata: per il tag acceptance

Validazione Avanzata con Espressioni Regolari

Per esigenze di validazione specifiche che vanno oltre i controlli standard, Contact Form 7 supporta le espressioni regolari (regex). Questa funzionalita e disponibile a partire dalla versione 5.6 del plugin.

Per applicare una espressione regolare a un campo, utilizza le Impostazioni Aggiuntive del modulo (la scheda in fondo alla pagina di modifica). La sintassi e:

validate:nome-campo /pattern/

Ecco alcuni esempi pratici:

Validazione codice fiscale italiano (16 caratteri alfanumerici):

validate:codice-fiscale /^[A-Z]{6}[0-9]{2}[A-Z][0-9]{2}[A-Z][0-9]{3}[A-Z]$/i

Validazione numero di telefono italiano:

validate:your-phone /^(+39)?[s]?[0-9]{2,4}[s]?[0-9]{6,8}$/

Validazione partita IVA (11 cifre):

validate:partita-iva /^[0-9]{11}$/

Validazione CAP italiano (5 cifre):

validate:cap /^[0-9]{5}$/

Le espressioni regolari sono strumenti potenti ma complessi. Un pattern errato potrebbe bloccare invii legittimi o accettare dati non validi. Testa sempre accuratamente le regex prima di metterle in produzione.

Validazione Condizionale

In alcuni casi potresti voler rendere un campo obbligatorio solo quando un altro campo ha un determinato valore. Ad esempio, il campo “Nome azienda” potrebbe essere obbligatorio solo se il visitatore seleziona “Azienda” come tipo di contatto. Questa funzionalita non e disponibile nativamente in Contact Form 7, ma puo essere implementata con il plugin Contact Form 7 Conditional Fields, che approfondiremo nella guida ai form avanzati.

Accessibilita dei Messaggi di Errore

Un aspetto spesso trascurato ma fondamentale e la accessibilita dei messaggi di errore per gli utenti con disabilita. Contact Form 7 gestisce automaticamente diversi aspetti della accessibilita:

I messaggi di errore vengono associati ai rispettivi campi tramite attributi ARIA, permettendo agli screen reader di annunciarli correttamente. Il tag <label> che avvolge ogni campo stabilisce una connessione tra la etichetta testuale e il campo di input, facilitando la navigazione con la tastiera.

Per migliorare ulteriormente la accessibilita, assicurati di utilizzare sempre il tag <label> intorno ai campi del modulo e scrivi messaggi di errore chiari e specifici. Evita messaggi generici come “Errore” e preferisci indicazioni precise come “Inserisci un indirizzo email valido nel formato nome@dominio.it”.

Consigli per una Validazione Efficace

La validazione non deve essere percepita dal visitatore come un ostacolo, ma come una guida. Ecco alcune pratiche consigliate:

Sii specifico nei messaggi di errore. Invece di “Campo non valido”, scrivi “Il numero di telefono deve contenere almeno 8 cifre”. Un messaggio specifico aiuta il visitatore a correggere immediatamente la informazione.

Usa placeholder coerenti. Se il campo telefono accetta il formato “+39 333 1234567”, mostra esattamente questo formato come placeholder. La coerenza tra il placeholder e la validazione riduce gli errori.

Non esagerare con la validazione. Una validazione troppo restrittiva frustrera i visitatori. Ad esempio, non richiedere un formato telefonico rigido se accetti chiamate internazionali con formati diversi.

Testa su dispositivi mobili. I messaggi di errore devono essere leggibili anche su schermi piccoli. Verifica che i messaggi non vengano troncati o sovrapposti ad altri elementi della pagina.

Per personalizzare la aspetto visivo dei messaggi di errore tramite CSS, consulta la nostra guida allo styling CSS di Contact Form 7.

Guide Correlate della Serie Contact Form 7

• Come Installare e Configurare Contact Form 7 su WordPress
• Creare un Form di Contatto Perfetto Passo Passo
• Tutti i Tag e Campi — Guida Completa
• Configurare Email, Notifiche e SMTP
• Validazione Campi, Messaggi di Errore e Conferma
• Protezione Spam con reCAPTCHA, Honeypot e Quiz
• Form Avanzati — Condizionali, Multi-Step e File Upload
• Integrazioni con Mailchimp, CRM e Zapier
• Personalizzare lo Stile con CSS — Guida Design
• Email Non Arrivano? Problemi Comuni e Soluzioni

Per una configurazione professionale dei tuoi moduli di contatto con validazione avanzata, affidati al team di G Tech Group. Contattaci per ricevere assistenza dedicata.