CONTACT FORM 7 GUIDA
TUTORIAL PER INSTALLARE E PERSONALIZZARE IL PLUGIN
CONTACT FORM 7 GUIDA
Hai creato il tuo sito con WordPress. Ora vuoi renderlo interattivo permettendo ai tuoi visitatori di contattarti tramite un form contatti wordpress, per cui hai deciso di installare il plugin per il contact form wp gratuito più completo, affidabile e sicuro per creare moduli di contatto. Hai svolto una ricerca in rete e ti sei orientato nella scelta di Contact Form 7 ma non sai bene come configurarlo. Se hai cercato “Contact Form 7 guida” in Google, con questo tutorial saprai installare e personalizzare Contact Form 7 passo per passo. Cominciamo!
CONTACT FORM 7 GUIDA:
INSTALLARE IL PLUGIN PER WORDPRESS
Installare il plugin WordPress Contact Form 7 nel tuo sito è davvero facilissimo! Come puoi vedere nell’immagine devi andare sul bottone PLUGIN – AGGIUNGI NUOVO
e cercare CONTACT FORM 7: ti comparirà questa immagine
Clicca su INSTALLA ORA. Alla fine del processo vedrai comparire nel menu di WordPress la specifica CONTATTI col simbolo della mail. Cliccaci sopra, ti comparirà AGGIUNGI – NUOVO e sarai pronto per configurare il tuo plugin Contact Form 7.
CONTACT FORM 7 GUIDA:
PERSONALIZZARE IL TUO MODULO DI CONTATTO
CF7: CARATTERIZZA IL TAG “MODULO”
Premi MODIFICA e ti comparirà il nuovo modulo contatti wordpress standard che hai appena creato con Contact Form 7.
Se vuoi immettere altre informazioni che ti interessa richiedere all’utente, hai la possibilità di personalizzarlo con alcune semplici procedure che ti spiegherò qui di seguito.
Vuoi per esempio inserire un campo in cui chiedi al visitatore il cognome. E’ sufficiente copiare la riga di codice con il nome, incollarla nello spazio successivo e modificare il titolo della label.
Se invece ti interessa conoscere il suo numero di telefono clicca sul bottone TEL e ti comparirà una finestrella dove potrai flaggare o meno l’obbligatorietà della richiesta (ricorda che per ogni campo questa caratteristica viene evidenziata dalla presenza o meno dell’asterisco, che puoi cancellare col tasto CANC).
Dopo aver cliccato INSERISCI TAG il modulo di contatto generato da cf7 sarà simile a questo:
Per evitare che i bot inondino di spam la tua posta è vivamente consigliabile inserire il campo reCAPTCHA. Dopo aver registrato il tuo website su Google reCAPTCHA e aver ottenuto la chiave del sito e la chiave segreta, seleziona CONTATTI – INTEGRAZIONE
e inserisci le due chiavi generate da Google.
Poi torna all’interno del tag MODULO, posizionati alla fine, premi sul bottone reCAPTCHA e verrà generato il contact form 7 shortcode corrispondente:
Se ti interessa inserire un modulo privacy premi sulla finestra ACCETTAZIONE e copia questa riga di codice
” Ho letto l’informativa Privacy e autorizzo il trattamento dei miei dati personali per le finalità ivi indicate. [/acceptance] “
Bene abbiamo completato la personalizzazione del Tag MODULO di Contact From 7! Ecco l’aspetto finale che troverai sullo schermo
CF7: CARATTERIZZA IL TAG “MAIL”
Ora vediamo come personalizzare il tag MAIL in tutorial Contact Form 7.
Il tag MAIL è il modulo dove è possibile configurare la schermata relativa alla mail che l’utente che compila il wp contact form ci invierà tramite il plugin. Qui puoi vedere come completare adeguatamente tutti i campi.
Ricorda che l’indirizzo email che inserirai dovrà avere necessariamente il nome del dominio del tuo sito, altrimenti il plugin ti rimanderà un messaggio di errore.
Scrollando verso il basso all’interno del modulo, flaggando Usa Mail (2), è possibile personalizzare anche una mail automatica di risposta che verrà inviata all’utente che ha richiesto le informazioni attraverso il form contatti contact form 7.
CF7: CARATTERIZZA IL TAG “MESSAGGI”
Seleziona ora il tag MESSAGGI. Ti apparirà un elenco dei messaggi che potranno comparire all’utente mentre inserisce i propri dati all’interno del modulo di contatto, per esempio dando indicazioni di errori di compilazione oppure un ringraziamento per aver completato la richiesta di informazioni.
Puoi modificare come più ti piace tutti i messaggi inclusi in questa schermata.
CF7: CARATTERIZZA IL TAG “INFORMAZIONI AGGIUNTIVE”
Cliccando sul tab INFORMAZIONI AGGIUNTIVE potrai introdurre, all’interno di un’area di testo, degli snippet di codice personalizzato che ti permetteranno per esempio di limitare l’uso del modulo di contatto solo agli utenti loggati oppure di personalizzare dei campi di Flamingo, il plugin gratuito di WordPress che ti permette di salvare le mail che gli utenti ti inviano attraverso Contact Form 7.
CONTACT FORM 7 GUIDA:
REALIZZARE UNA THANK YOU PAGE
Bene, se sei arrivato fin qui vuol dire che sei riuscito a customizzare il plugin Contact Form 7! Ti manca un solo passaggio prima di completare la configurazione del tuo modulo di contatto. Continua a leggere perché con questo Contact Form 7 tutorial ti insegnerò a indirizzare il tuo utente su una thank you page, che ti servirà sia per farlo atterrare su una landing page personalizzata del tuo sito sia per tracciare l’avvenuta richiesta di contatto mediante GOOGLE ANALYTICSCopia le seguenti righe di codice:
|
// Thank you page per Contact Form 7
function add_this_script_footer(){ ?>
<script>
document.addEventListener( ‘wpcf7mailsent’, function( event ) {
location = ‘http://NomeSito.com/thankyoupage/’;
}, false );
</script>
<?php }
add_action(‘wp_footer’, ‘add_this_script_footer’);
|
Inseriscile in ASPETTO – EDITOR – FUNCTIONS.PHP, come vedi qui nello screenshot, oppure all’interno di un plugin personalizzato che ti permetterà di evitare di perdere le modifiche quando aggiornerai il tuo tema
Dopa aver concluso questa procedura sarai riuscito creare la tua thank you page personalizzata!
CONTACT FORM 7 GUIDA:
AGGIUNGERE IL FORM CONTATTI ALLE PAGINE DEL TUO SITO
Ora possiamo fare il punto della situazione: in questo tutorial contact form 7 guida abbiamo
– installato il plugin WordPress Contact Form 7
– personalizzato i Tag Modulo, Mail, Messaggi, Informazioni Aggiuntive
– indirizzato l’utente verso una thank you page alla fine della compilazione del modulo.
Adesso che abbiamo terminato la configurazione dobbiamo aggiungere il modulo che abbiamo creato alla pagina CONTATTI oppure in un widget testo nella sidebar.
Copia lo shortcode creato dal plugin che trovi in alto nella pagina
Incollalo per esempio nella tua pagina CONTATTI
Ora visualizza nel sito la tua pagina CONTATTI: questo sarà il risultato che troverai!
Bene, siamo giunti alla conclusione di questo tutorial Contact Form 7 guida.
Questo è solo una piccolissima parte di tutto quello che puoi fare con un CMS come WordPress.
Se ti interessa approfondire l’argomento puoi consultare GRATUITAMENTE la nostra guida per creare pagina blog wordpress tramite un pagebuilder.
Ma questa è solo la prima parte di un percorso più approfondito che puoi seguire se ti piace creare siti o blog con WordPress, e che ti porterà a diventare un professionista del settore. Insieme ai nostri COACH ONLINE WORDPRESS puoi infatti sviluppare passo per passo il tuo sito dalla scelta dell’hosting e del dominio fino alla creazione delle categorie, dei contenuti e all’ottimizzazione SEO.
Se invece vuoi cominciare a scrivere contenuti efficaci nel tuo blog puoi seguire i consigli che i nostri esperti svelano nel CORSO Wordpress for Blogging e Seo Copywriting
Potresti anche interessarti capire meglio il linguaggio HTML. Possiamo proporti dei corsi HTML specifici online e on demand!
Puoi approfondire anche quali altri form contatti WordPress scegliere.
Informandoti in rete hai invece capito che vorresti approfondire meglio tutte le tematiche digital per acquisire professionalità e determinazione nel perseguire il tuo obiettivo di diventare un esperto del web. Puoi seguire in aula oppure online il MASTER WEB MARKETING
Richiedi più informazioni su come formarti sull’utilizzo di WordPress