Creare un modulo di contatto con Contact Form 7

Creare un form di contatto

Se ad un certo punto ti sei accorto di avere bisogno di un plugin per creare un form di contatto pratico, flessibile e modificabile è probabile che tu abbia sentito parlare di CF7 che starebbe per Contact Form 7.

Con oltre 8 milioni di download, supporto per i sistemi AJAXCAPTCHA e Akismet, Contact Form 7 supporta i sistemi per evitare ogni tipo di spam ed è di fatto uno standard quando si parla di form di contatto.

In altri articoli abbiamo visto che ci sono diversi altri modi per creare dei canali di comunicazione con la tua audience come le Email, Facebook, Twitter o Skype. Ma ad oggi nessuno di questi supera completamente la funzionalità on site del form di contatto.

Adesso vediamo come si usa Contact Form 7.

Creare un Form di Contatto con CF7

Prima di cominciare devi installare e attivare questo plugin dal tuo pannello di amministrazione.

Installazione contact form 7

Vediamo come:

  1. Accedi alla Bacheca del tuo sito e naviga in Plugin > Aggiungi nuovo;
  2. Nel campo di ricerca, digita Contact Form 7;
  3. Clicca Installa Adesso e, completata l’istallazione, Attiva;

Ora il tuo plugin è attivo e troverai nella sidebar di sinistra del tuo pannello di amministrazione una voce inserita: Contatti. Cliccaci sopra.

La prima cosa che vedrai è una schemata su cui è visualizzata la lista dei form di contatto che hai creato (appena attivi il plugin, è già disponibile un form di contatto da usare come modello).

Clicca sul nome del form di contatto per iniziare a personalizzarlo.

Il meccanismo per creare un form di contatto con CF7 è molto semplice.

Configurazione form di contatto

Nel primo campo che vedi puoi inserire il nome del form di contatto.

Nella sezione “Modulo” troverai una serie di codici HTML di default a cui corrispondono una serie di campi come: nome, cognome, email, testo e così via…

Mettiamo caso tu voglia inserire un’Area di Testo dove l’utente potrà scrivere la sua richiesta.

Quello che devi fare è posizionare all’interno dell’area di testo il cursore dove vuoi che appaia il campo di testo, quindi, cliccare “Area di testo” sopra al form.

Fatto questo, appariranno all’interno dell’area di testo i tag ed i codici HTML necessari per visualizzare l’area di testo.

Puoi quindi procedere nella configurazione del form aggiungendo tutti gli elementi che desideri.

Un consiglio: costruisci dei form più semplici possibile, richiedendo le informazioni strettamente necessarie. Le persone non amano dare troppe informazioni personali. Noi per i nostri Ebook per esempio richiediamo solo nome e Email.

Mail

Cliccando sulla tab “Mail” potrai configurare il messaggio che ti sarà inviato quando un utente invia una richiesta tramite il form di contatto.

All’interno del messaggio puoi usare gli stessi tag che hai usato per configurare il form (anche in questo caso, vedrai un esempio già pronto).

Una funzionalità interessante è quella che può essere attivata spuntando la voce Mail 2 a fondo pagina. Potrai infatti configurare un secondo messaggio da inviare. In questo caso, potresti far sì che venga inviato ad un tuo collaboratore, oppure all’utente stesso come conferma di ricevuta della richiesta.

Messaggi

La sezione Messaggi è dove puoi configurare i messaggi di conferma/errore che appariranno quando l’utente cerca di inviare i form di contatto.

Messaggi contact form 7

Se usi WordPress in italiano, i messaggi dovrebbero essere già configurati in modo opportuno. Ti consiglio però di rivederli con attenzione in modo da assicurarti che siano corretti.

Impostazioni aggiuntive

All’interno della tab Impostazioni Aggiuntive trovi un’area di testo dove puoi incollare snippet di codice per personalizzare il tuo form. Per maggiori informazioni sui codici che puoi usare, visita questa pagina sul sito ufficiale del plugin.

Conclusione

Hai visto come utilizzare un semplice plugin per creare dei form di contatto efficienti e protetti da ogni tipo di spam o violazione.

Oltre ad essere utile come mezzo di comunicazione e di contatto con la tua audience, è anche un ottimo modo per raccogliere le email dei tuoi visitatori per iniziare a costruire una mailing list.

Per ogni dubbio o domanda ci vediamo nel box dei commenti!

Cerchi un tecnico esperto ed un aiuto rapido?

Se in qualsiasi momento avessi bisogno del supporto di un professionista rapido e dal costo accessibile, ti suggeriamo di provare il servizio di assistenza di SOS WP.

Andrea Di Rocco

Andrea Di Rocco

Ciao! Sono Andrea, il webmaster di SOS WordPress. La mia missione è di aiutarti a diventare autonomo nel creare il tuo sito web, posizionarti sui motori di ricerca e guadagnare online grazie al tuo progetto. Oltre a questo voglio far si che tu spenda il minor quantitativo di soldi e tempo mentre raggiungi i tuoi obiettivi sul web. Conosciamoci nell'area commenti di questo articolo!

[PROMO LIMITATA] 50% SU HOSTING SITEGROUND + ASSISTENZA SOS WP GRATIS

SiteGround - Miglior hosting per Wordpress
71 commenti
  1. dice:

    Ciao, qual’è la parte di codice da modifcare nelle stringhe di questo plugin per rendere i campi NON OBBLIGATORI MA FACOLTATIVI? Grazie…

    Rispondi
  2. dice:

    Ciao Andrea, complimenti per le guide utilissime che pubblichi.
    Sto provando a costruire un form da usare con “email before download” e “download monitor” per far scaricare un PDF e funziona tutto tranne il nome del file che arriva all’utente. Ora la mail è: “Ciao … puoi scaricare il file “Download #262 File Version” (con il link al file)”. Mi piacerebbe che al posto di “Download #262 File Version” ci fosse il nome del file da scaricare. Le ho provate tutte, ma non riesco proprio a capire come si fa.
    Grazie!

    Rispondi
  3. dice:

    Ciao, un’informazione.
    Uso MailChimp e ho visto che esiste un add-on di CF7 per quest’ultimo. Mi chiedevo però se c’è un sistema per bloccare la ricezione da determinati domini, come avviene con email before download.
    L’obiettivo è non sporcare la mia lista contatti con email temporanee visto che fornisco un video gratuito.

    Grazie anticipatemente

    Rispondi
  4. dice:

    Ciao, poichè sono di un’ignoranza abissale e una capoccia dura,vorrei chiederti una cosa ho installato il plugin, attivato e lo sto configurando se ho capito la tab MAIL serve quando qualcuno manda un messaggio tramite il form,questa impostazione che fornisce, MAIL, è un modulo di risposta che uso quando vengo contattata? Spero di essermi espressa chiaramente e come al solito grazie per il supporto che fornite, se riesco a creare il blog è prorprio grazie a questo sito

    Rispondi
  5. dice:

    Ciao Alessandro, grazie della guida, una domanda:
    è possibile impostare il tasto INVIO in modo che se l’utente compila e invia i dati ha accesso ad un contenuto/file nel sito?
    Grazie!

    Rispondi
  6. dice:

    Ciao a tutti! Io vorrei creare un form ma limitato, ovvero, che può essere utilizzando solo da chi ha un email aziendale (quindi non gmail, yahoo virgilio ecc..) come potrei fare?

    Rispondi
  7. dice:

    ciao, sto usando da poco wordpress, premetto non sono una grande esperta. Ho aggiunto tra i pugin contact form 7, attivato, eseguito le istruzioni, ma solo io riesco ad inserire commenti, gli altri utenti, quindi chi legge gli articoli, non riesce, dopo aver compilato email e testo del messaggio, appare la seguente dicitura: gateway time out e non riescono quindi ad inserire nulla. forse ho saltato qualche passaggio? quale? non riesco a capire. grazie

    Rispondi
    • dice:

      Ciao Tamara,
      WordPress è aggiornato?
      Ti consiglio di controllare tutti gli aggiornamenti, ed eventualmente disinstallare e installare di nuovo il plugin.
      Fammi sapere, un saluto!

      Rispondi
  8. dice:

    Ciao Andrea,

    Non riesco a capire se questo plugin fa per me :)
    Quello che mi serve è la seguente cosa:

    Un utente (magari tramite log di Facebook, altrimenti fa niente) inserisce un dei dati in un form, questi dati li vorrei salvare su una Tabella SQL, e successivamente su un pagina nel frontend del sito, qualsiasi persona può visualizzare i dati di questa tabella.

    In pratica sarebbe come una “recensione” di ristoranti, negozi, luoghi etc etc… per gli utenti, fatta da utenti :)

    La cosa perfetta sarebbe tramite qualche configurazione semplice, poter creare diverse pagine per visualizzare i dati. Per esempio se nella tabella c’è “tipologia” che può avere valori come “ristorante”, “pizzeria”, “negozio”, nella pagina “ristorante” vedo solo le recensioni con tipologia “ristorante”.

    Spero di essermi spiegato abbastanza bene :D Spero che esiste un plugin che faccia questo :D

    Grazie tante
    Stefano

    Rispondi
  9. dice:

    Salve, ho creato un form per i contatti con cf7 dove l’utente può scaricare un pdf da compilare per poi allegare e rispedirla al form classico, sotto a tutto viene visualizzato il tasto scegli file e si apre la finestra del desk del pc dove si può scegliere il file, una volta inviato tutto funziona ma la mail arriva senza allegato….come posso fare????
    Grazie

    Rispondi
  10. dice:

    Ciao,
    vorrei sapere come si fa per applicare stili css diversi a moduli diversi, mi spiego, ho un modulo “contattaci” ed uno “preventivo”, con diposizioni numeri di campi diversi; così ho fatto un modulo per ciascun “gruppo di campi” diciamo, ma mi applica lo style css solo sul primo ovvero “contattaci”, com eposso fare per applicarlo anche a “preventivi”?

    grazie

    Rispondi
    • dice:

      Ciao Eugenio,
      puoi usare lo strumento ispeziona elemento della console Chrome. In questo modo potrai verificare che ogni form ha in realtà un suo ID. Potrai quindi scrivere codici css specifici per l’ID che desideri, per targetizzarli in modo specifico. Un saluto, e grazie del tuo commento ;-)

      Rispondi
  11. dice:

    Ciao,
    ho installato Contact Form 7, ma ho un problema. Non riesco a ridimensionare il campo text del nome. Qualunque dimensione inserisca rimane sempre della stessa lunghezza. Il codice che inserisco è questo:
    Nome
    [text* your-name size:30 maxlength:10]

    Qualsiasi cifra metto nell’attributo maxlenght, non mi riduce la lunghezza del campo.
    Come posso fare?
    Grazie

    Rispondi
  12. dice:

    ciao
    l’ho installato facilmente ma provo e non capisco dove arrivi la mail.
    se nell’area mail metto la mia mail privata e riempio il form non mi arriva la mail. Perché?
    Sbaglio qualcosa?

    Rispondi
  13. dice:

    Ciao!
    Innanzitutto complimenti per il sito!
    Sto usando CF7 per creare una domanda di iscrizione (online) per un’associazione sportiva. Per fare questo va richiesta l’accettazione dello statuto e della privacy: ho trovato come generare i pulsanti di accettazione/negazione, ma non so come fare il box (con barra di scorrimento) in cui inserire il testo da accettare.
    Non è pensabile di metterlo per esteso visto che lo statuto è di 6 pagine A4 ;)
    Grazie,
    Ludo

    Rispondi
  14. dice:

    Ciao Andrea,
    noto che la mail lato admin arriva sempre nello spam e rischio di perdere importanti messaggi, come posso fare per risolvere questo problema?
    Ho provato utilizzando un indirizzo ‘dominio’ e uno Gmail ma rilevo sempre lo stesso problema.

    Rispondi
  15. dice:

    Ciao,
    io l’ho provato e secondo me questo plugin è un pò sempliciotto e crea dei form elementari, addirittura non si possono mettere neanche i campi su 2 colonne affiancate e il dell’informativa dati personali non apre una popup dove mettere il testo dell’informativa. Anche graficamente è molto spartano a meno che non si compri la versione a pagamento.

    Rispondi
    • dice:

      Ciao!
      In realtà Contact Form 7 è secondo noi un ottimo plugin, personalizzabile ampiamente se si mastica un po’ di codice.
      Hai trovato qualche valida alternativa?
      Un saluto!

      Rispondi
  16. dice:

    Ciao Andrea, ho impostato il form contatto nei widget in barra laterale di ogni pagina, c’è un modo per capire da quale pagina è stato utilizzato il form? sarebbe una cosa molto utile

    Rispondi
    • dice:

      Ciao Luca, grazie per il commento. Potresti creare un contact form per ciascuna pagina ed includere nella email di notifica che viene inviata a te anche l’URL della pagina su cui è inserito quello specifico contact form.
      Fammi sapere se ti trovi bene con questa soluzione!

      Rispondi
  17. dice:

    Ciao Andrea, ho lo stesso problema di Massimo. La rotellina ruota all’infinito e non restuituisce nessun messaggio di conferma, tuttavia le mail arrivano correttamente. Ho disattivato tutti i plugin, svuotato la cache del browser, ma non cambia nulla..La sezione messaggi è precompilata con messaggi di conferma ecc…Ho anche provato a disinstallare il plugin e a re-installarlo. Il sito è su server linux+win.. Non so più cosa provare. Idee?

    Rispondi
  18. dice:

    Ciao Andrea,ho installato e provato contact form mettendo la mia email e ricevendo il messaggio nella mia casella di posta, oggi a distanza di alcuni giorni ho riprovato anche cambiando email e controllando nella posta spam,ma non mi arriva più nessun messaggio,mi indica anche che il messaggio è stato inviato con successo ma nella casella di posta non mi arriva niente cosa è potuto succedere? grazie

    Rispondi
    • dice:

      Ciao, grazie per il commento.
      Ho letto su alcuni forum che diversi utenti che usano Tophost hanno problemi con Contact Form 7; il mio consiglio è di provare a contattare proprio Tophost, in quanto credo che questa domanda gli sia stata posta da molti. Fammi sapere se sono in grado di aiutarti ;)

      Rispondi
  19. dice:

    http://www.mtcommunication.eu – sito in costruzione – come faccio a far comparire un messaggio del tipo messaggio inviato correttamente nella stessa pagina del modulo contatti. Ho notato che il messaggio viene inviato ma continua a girare la clessidra formata da due freccettine che formano un cerchio, potrebbe gentilmente spiegarmi passo passo la procedura per realizzare quanto richiesto. grazie Massimo Tavano

    Rispondi
    • dice:

      Ciao Massimo, grazie per la domanda.
      Per far apparire un messaggio di conferma di invio del form devi accedere alla pagina di configurazione del tuo form e scorrere verso il basso fino ad arrivare ad un box chiamato “Messaggi”. Qui potrai inserire i vari messaggi che vuoi far apparire nel caso di messaggio inviato, errore, ecc. Ti allego anche uno screenshot, a presto!

      Rispondi

Lascia un Commento

Vuoi partecipare alla discussione?
Fornisci il tuo contributo!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *