Seleziona una pagina

CONTACT FORM 7 GUIDA

TUTORIAL PER INSTALLARE E PERSONALIZZARE IL PLUGIN

CONTACT FORM 7 GUIDA

Contact Form 7 Guida Foto

Hai creato il tuo sito con WordPress. Ora vuoi renderlo interattivo permettendo ai tuoi visitatori di contattarti, per cui hai deciso di installare il plugin WordPress 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

 

Contact Form 7 Guida aggungi nuovo plugin

 

e cercare CONTACT FORM 7: ti comparirà questa immagine

Contact Form 7 Guida

 

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 Modulo Aggiunto

 

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.

Contact Form 7 Guida Default Module

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).

Contact Form 7 Guida Tag Telefono

 

Dopo aver cliccato INSERISCI TAG il modulo di contatto generato da contact form 7 sarà simile a questo:

Contact Form 7  Guida Tag Telefono Aggiunto

 

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  

Contact Form 7 Guida Recaptcha Contatti Integrazione

 

e inserisci le due chiavi generate da Google.

Contact Form 7 Guida Recaptcha Contatti Integrazione

 

Poi torna all’interno del tag MODULO, posizionati alla fine, premi sul bottone reCAPTCHA e verrà generato il contact form 7 shortcode corrispondente:

Contact Form 7 Guida Tag Recaptcha

 

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] “

Contact Form 7 Guida Tag Accettazione

 

Bene abbiamo completato la personalizzazione del Tag MODULO di Contact From 7! Ecco l’aspetto finale che troverai sullo schermo

Contact Form 7 Guida tag Modulo Completo

 

CF7: CARATTERIZZA IL TAG “MAIL”

Ora vediamo come personalizzare il tag MAIL in tutorial Contact Form 7 guida.
Il tag MAIL è il modulo dove è possibile configurare la schermata relativa alla mail che l’utente che compila il contact form ci invierà tramite il plugin. Qui puoi vedere come completare adeguatamente tutti i campi.

Contact Form 7 Guida Tag Mail

 

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.

Contact Form 7 Guida Mail 2

 

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.

Contact Form 7 Guida Tag Messaggi 

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 Tag Informazioni Aggiuntive

 

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 tutorial Contact Form 7 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 ANALYTICS
Copia 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

Contact Form 7 Guida Configurazione Thank You Page

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

Contact Form 7 Guida Copia Form Code

 

Incollalo per esempio nella tua pagina CONTATTI

Contact Form 7 Guida Incolla Contact Form

 

Ora visualizza nel sito la tua pagina CONTATTI: questo sarà il risultato che troverai!

 Contact Form 7 Guida Modulo Contatti

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 scaricare GRATUITAMENTE la nostra MINIGUIDA WORDPRESS 

Se invece vuoi imparare ad utilizzare tutte le funzionalità di WordPress per costruire il tuo sito o creare il tuo blog puoi iscriverti al nostro CORSO!

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.

WordPress Coaching

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

Corso WordPress for Blogging

Potresti anche interessarti capire meglio il linguaggio HTML. Possiamo proporti dei corsi HTML specifici online e ondemand!

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

Master WEB Marketing

 

  • Rating Lettori
  • Votato 4.7 stelle
    4.7 / 5 (22 )
  • Vota!


Save

 

[index]
[index]
[523.251,659.255,783.991]
[523.251,659.255,783.991]
[523.251,659.255,783.991]
[523.251,659.255,783.991]