{"id":19649,"date":"2025-05-26T09:45:30","date_gmt":"2025-05-26T09:45:30","guid":{"rendered":"https:\/\/soccorsowp.it\/blog\/?p=19649"},"modified":"2025-05-24T10:12:10","modified_gmt":"2025-05-24T10:12:10","slug":"come-creare-un-modulo-contatto-wordpress-guida-passo-passo-con-contact-form-7-e-wpforms","status":"publish","type":"post","link":"https:\/\/soccorsowp.it\/blog\/come-creare-un-modulo-contatto-wordpress-guida-passo-passo-con-contact-form-7-e-wpforms\/","title":{"rendered":"Come creare un modulo contatto WordPress: guida passo passo con Contact Form 7 e WPForms"},"content":{"rendered":"<article class=\"text-token-text-primary w-full\" dir=\"auto\" data-testid=\"conversation-turn-12\" data-scroll-anchor=\"true\">\n<div class=\"text-base my-auto mx-auto py-5 [--thread-content-margin:--spacing(4)] @[37rem]:[--thread-content-margin:--spacing(6)] @[72rem]:[--thread-content-margin:--spacing(16)] px-(--thread-content-margin)\">\n<div class=\"[--thread-content-max-width:32rem] @[34rem]:[--thread-content-max-width:40rem] @[64rem]:[--thread-content-max-width:48rem] mx-auto flex max-w-(--thread-content-max-width) flex-1 text-base gap-4 md:gap-5 lg:gap-6 group\/turn-messages focus-visible:outline-hidden\" tabindex=\"-1\">\n<div class=\"group\/conversation-turn relative flex w-full min-w-0 flex-col agent-turn\">\n<div class=\"relative flex-col gap-1 md:gap-3\">\n<div class=\"flex max-w-full flex-col grow\">\n<div class=\"min-h-8 text-message relative flex w-full flex-col items-end gap-2 text-start break-words whitespace-normal [.text-message+&amp;]:mt-5\" dir=\"auto\" data-message-author-role=\"assistant\" data-message-id=\"4794ff44-b212-44e9-8fc4-2fac40194546\" data-message-model-slug=\"gpt-4o\">\n<div class=\"flex w-full flex-col gap-1 empty:hidden first:pt-[3px]\">\n<div class=\"markdown prose dark:prose-invert w-full break-words dark\">\n<h2 data-start=\"625\" data-end=\"690\">Perch\u00e9 avere un modulo contatto su WordPress \u00e8 fondamentale<\/h2>\n<p data-start=\"692\" data-end=\"1083\">Se stai costruendo il tuo sito web <a href=\"https:\/\/soccorsowp.it\/blog\/blocco-di-contenuti-opt-in-per-wordpress\/\">WordPress<\/a>, <strong data-start=\"738\" data-end=\"808\">uno dei primi strumenti che dovresti inserire \u00e8 il modulo contatto<\/strong>. Semplice, immediato, funzionale: il modulo di contatto \u00e8 il <strong data-start=\"870\" data-end=\"909\">ponte diretto tra te e i visitatori<\/strong>. Che tu gestisca un blog personale, un sito aziendale o un e-commerce, avere un modulo ben fatto vuol dire <strong data-start=\"1017\" data-end=\"1082\">non perdere opportunit\u00e0 di contatto, collaborazione o vendita<\/strong>.<\/p>\n<p data-start=\"1085\" data-end=\"1402\">A differenza di un indirizzo email scritto nella pagina, un modulo ben progettato ti consente di <strong data-start=\"1182\" data-end=\"1248\">filtrare i messaggi, guidare l\u2019utente e proteggerti dallo spam<\/strong>. Ecco perch\u00e9 ti spiegher\u00f2 come farlo con <strong data-start=\"1290\" data-end=\"1308\">Contact Form 7<\/strong>, plugin storico, versatile e gratuito, e ti proporr\u00f2 un\u2019alternativa pi\u00f9 moderna: <strong data-start=\"1390\" data-end=\"1401\">WPForms<\/strong>.<\/p>\n<h2 data-start=\"1409\" data-end=\"1470\">Creare un modulo contatto WordPress con Contact Form 7<\/h2>\n<h3 data-start=\"1472\" data-end=\"1503\">Installazione del plugin<\/h3>\n<p data-start=\"1505\" data-end=\"1787\">Partiamo dalle basi. Per prima cosa devi <strong data-start=\"1546\" data-end=\"1575\">installare Contact Form 7<\/strong>. Accedi al pannello di amministrazione di WordPress, clicca su <strong data-start=\"1639\" data-end=\"1666\">Plugin &gt; Aggiungi nuovo<\/strong>, digita \u201cContact Form 7\u201d nella barra di ricerca e premi su <strong data-start=\"1726\" data-end=\"1742\">Installa ora<\/strong>. Una volta installato, clicca su <strong data-start=\"1776\" data-end=\"1786\">Attiva<\/strong>.<\/p>\n<p data-start=\"1789\" data-end=\"1874\">Ti troverai una nuova voce di menu chiamata \u201cContatto\u201d. Da l\u00ec inizier\u00e0 la vera magia.<\/p>\n<h3 data-start=\"1876\" data-end=\"1903\">Creazione del modulo<\/h3>\n<p data-start=\"1905\" data-end=\"2066\">Per creare il tuo primo modulo, clicca su \u201cAggiungi nuovo\u201d. Puoi dargli un nome descrittivo tipo \u201cModulo contatti home page\u201d, e poi cominciare a personalizzarlo.<\/p>\n<p data-start=\"2068\" data-end=\"2372\"><strong data-start=\"2068\" data-end=\"2119\">Il modulo base include gi\u00e0 i campi fondamentali<\/strong>: nome, email, oggetto, messaggio e bottone di invio. Puoi tranquillamente partire da quello. Ma se vuoi aggiungere campi extra, come il numero di telefono, checkbox o men\u00f9 a tendina, puoi farlo facilmente con i pulsanti rapidi che trovi sopra l\u2019editor.<\/p>\n<p data-start=\"2374\" data-end=\"2401\">Esempio di codice semplice:<\/p>\n<div class=\"contain-inline-size rounded-md border-[0.5px] border-token-border-medium relative bg-token-sidebar-surface-primary\">\n<div class=\"flex items-center text-token-text-secondary px-4 py-2 text-xs font-sans justify-between h-9 bg-token-sidebar-surface-primary dark:bg-token-main-surface-secondary select-none rounded-t-[5px]\">html<\/div>\n<div class=\"sticky top-9\">\n<div class=\"absolute end-0 bottom-0 flex h-9 items-center pe-2\">\n<div class=\"bg-token-sidebar-surface-primary text-token-text-secondary dark:bg-token-main-surface-secondary flex items-center rounded-sm px-2 font-sans text-xs\"><button class=\"flex gap-1 items-center select-none px-4 py-1\" aria-label=\"Copia\">Copia<\/button><span class=\"\" data-state=\"closed\"><button class=\"flex items-center gap-1 px-4 py-1 select-none\">Modifica<\/button><\/span><\/div>\n<\/div>\n<\/div>\n<div class=\"overflow-y-auto p-4\" dir=\"ltr\"><code class=\"whitespace-pre! language-html\"><code class=\"whitespace-pre! language-html\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span><\/span>&gt; Il tuo nome<br \/>\n[text* your-name] <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span><\/span>&gt;<\/code><\/code><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span><\/span>&gt; La tua email<br \/>\n[email* your-email] <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span><\/span>&gt;<code class=\"whitespace-pre! language-html\"><code class=\"whitespace-pre! language-html\"><\/code><\/code><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span><\/span>&gt; Messaggio<br \/>\n[textarea your-message] <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span><\/span>&gt;<\/p>\n<p><code class=\"whitespace-pre! language-html\"><code class=\"whitespace-pre! language-html\"><\/code><\/code>[submit &#8220;Invia&#8221;]<\/p>\n<\/div>\n<\/div>\n<h3 data-start=\"2584\" data-end=\"2624\">Configurare le email di ricezione<\/h3>\n<p data-start=\"2626\" data-end=\"2796\">Una delle parti pi\u00f9 importanti \u00e8 la scheda <strong data-start=\"2669\" data-end=\"2679\">\u201cMail\u201d<\/strong>. Qui decidi <strong data-start=\"2692\" data-end=\"2723\">dove arriveranno i messaggi<\/strong>, ovvero quale indirizzo email ricever\u00e0 i contenuti inviati dagli utenti.<\/p>\n<p data-start=\"2798\" data-end=\"2948\">Puoi anche personalizzare l\u2019oggetto e il contenuto dell\u2019email. Ad esempio, potresti inserire nel corpo dell\u2019email i campi compilati dagli utenti cos\u00ec:<\/p>\n<div class=\"contain-inline-size rounded-md border-[0.5px] border-token-border-medium relative bg-token-sidebar-surface-primary\">\n<div class=\"flex items-center text-token-text-secondary px-4 py-2 text-xs font-sans justify-between h-9 bg-token-sidebar-surface-primary dark:bg-token-main-surface-secondary select-none rounded-t-[5px]\">makefile<\/div>\n<div class=\"sticky top-9\">\n<div class=\"absolute end-0 bottom-0 flex h-9 items-center pe-2\">\n<div class=\"bg-token-sidebar-surface-primary text-token-text-secondary dark:bg-token-main-surface-secondary flex items-center rounded-sm px-2 font-sans text-xs\"><button class=\"flex gap-1 items-center select-none px-4 py-1\" aria-label=\"Copia\">Copia<\/button><span class=\"\" data-state=\"closed\"><button class=\"flex items-center gap-1 px-4 py-1 select-none\">Modifica<\/button><\/span><\/div>\n<\/div>\n<\/div>\n<div class=\"overflow-y-auto p-4\" dir=\"ltr\"><code class=\"whitespace-pre!\"><span class=\"hljs-section\">Da: [your-name] &lt;[your-email]&gt;<\/span><br \/>\n<span class=\"hljs-section\">Messaggio:<\/span><br \/>\n[your-message]<br \/>\n<\/code><\/div>\n<\/div>\n<p data-start=\"3016\" data-end=\"3027\">Facile, no?<\/p>\n<h3 data-start=\"3029\" data-end=\"3078\">Protezione anti-spam con Google reCAPTCHA<\/h3>\n<p data-start=\"3080\" data-end=\"3255\">Uno dei problemi principali dei moduli \u00e8 lo <strong data-start=\"3124\" data-end=\"3132\">spam<\/strong>. Per fortuna, Contact Form 7 \u00e8 compatibile con <strong data-start=\"3180\" data-end=\"3200\">Google reCAPTCHA<\/strong>, un sistema gratuito che filtra automaticamente i bot.<\/p>\n<p data-start=\"3257\" data-end=\"3280\">Ecco come configurarlo:<\/p>\n<ol data-start=\"3282\" data-end=\"3493\">\n<li data-start=\"3282\" data-end=\"3363\">\n<p data-start=\"3285\" data-end=\"3363\">Registrati su Google reCAPTCHA e ottieni <strong data-start=\"3326\" data-end=\"3341\">chiave sito<\/strong> e <strong data-start=\"3344\" data-end=\"3362\">chiave segreta<\/strong>.<\/p>\n<\/li>\n<li data-start=\"3364\" data-end=\"3447\">\n<p data-start=\"3367\" data-end=\"3447\">Vai su <strong data-start=\"3374\" data-end=\"3401\">Contatto &gt; Integrazione<\/strong>, clicca su reCAPTCHA e incolla le due chiavi.<\/p>\n<\/li>\n<li data-start=\"3448\" data-end=\"3493\">\n<p data-start=\"3451\" data-end=\"3493\">Inserisci nel modulo il tag <code data-start=\"3479\" data-end=\"3492\">[recaptcha]<\/code>.<\/p>\n<\/li>\n<\/ol>\n<p data-start=\"3495\" data-end=\"3522\"><strong data-start=\"3495\" data-end=\"3522\">Et voil\u00e0! Sei protetto.<\/strong><\/p>\n<h3 data-start=\"3524\" data-end=\"3563\">Inserire il modulo in una pagina<\/h3>\n<p data-start=\"3565\" data-end=\"3780\">Una volta salvato il modulo, <strong data-start=\"3594\" data-end=\"3626\">verr\u00e0 generato uno shortcode<\/strong>. Copialo (es. <code data-start=\"3641\" data-end=\"3693\">[contact-form-7 id=\"1234\" title=\"Modulo contatti\"]<\/code>) e incollalo <strong data-start=\"3707\" data-end=\"3741\">in qualsiasi pagina o articolo<\/strong> tramite l\u2019editor a blocchi o classico.<\/p>\n<h2 data-start=\"3787\" data-end=\"3838\">Vuoi qualcosa di pi\u00f9 intuitivo? Prova WPForms<\/h2>\n<p data-start=\"3840\" data-end=\"3996\">Non ti senti troppo a tuo agio con i codici e gli shortcode? Nessun problema! Esiste un\u2019alternativa <strong data-start=\"3940\" data-end=\"3972\">user-friendly, drag-and-drop<\/strong>: si chiama <strong data-start=\"3984\" data-end=\"3995\">WPForms<\/strong>.<\/p>\n<h3 data-start=\"3998\" data-end=\"4025\">Installazione rapida<\/h3>\n<p data-start=\"4027\" data-end=\"4149\">Anche in questo caso, vai su <strong data-start=\"4056\" data-end=\"4083\">Plugin &gt; Aggiungi nuovo<\/strong>, cerca \u201cWPForms\u201d, clicca su <strong data-start=\"4112\" data-end=\"4128\">Installa ora<\/strong> e poi su <strong data-start=\"4138\" data-end=\"4148\">Attiva<\/strong>.<\/p>\n<p data-start=\"4151\" data-end=\"4195\">Troverai nel menu la nuova voce <strong data-start=\"4183\" data-end=\"4194\">WPForms<\/strong>.<\/p>\n<h3 data-start=\"4197\" data-end=\"4235\">Creazione tramite drag-and-drop<\/h3>\n<p data-start=\"4237\" data-end=\"4358\">Clicca su <strong data-start=\"4247\" data-end=\"4265\">Aggiungi nuovo<\/strong> e scegli un template: puoi iniziare con \u201cModulo di contatto semplice\u201d oppure creare da zero.<\/p>\n<p data-start=\"4360\" data-end=\"4518\">L\u2019editor \u00e8 molto visivo: puoi <strong data-start=\"4390\" data-end=\"4412\">trascinare i campi<\/strong> che vuoi nel modulo (nome, email, casella di testo, telefono, dropdown ecc.). Non serve conoscere codice.<\/p>\n<p data-start=\"4520\" data-end=\"4585\">Ogni campo pu\u00f2 essere rinominato e personalizzato con pochi clic.<\/p>\n<h3 data-start=\"4587\" data-end=\"4624\">Configura notifiche e conferme<\/h3>\n<p data-start=\"4626\" data-end=\"4674\">Vai nelle <strong data-start=\"4636\" data-end=\"4652\">Impostazioni<\/strong> del modulo e imposta:<\/p>\n<ul data-start=\"4676\" data-end=\"4792\">\n<li data-start=\"4676\" data-end=\"4724\">\n<p data-start=\"4678\" data-end=\"4724\"><strong data-start=\"4678\" data-end=\"4696\">Notifica email<\/strong>: a chi inviare il messaggio<\/p>\n<\/li>\n<li data-start=\"4725\" data-end=\"4792\">\n<p data-start=\"4727\" data-end=\"4792\"><strong data-start=\"4727\" data-end=\"4746\">Conferma visiva<\/strong>: il messaggio che l\u2019utente vedr\u00e0 dopo l\u2019invio<\/p>\n<\/li>\n<\/ul>\n<p data-start=\"4794\" data-end=\"4841\">Puoi anche mandare una copia all\u2019utente stesso!<\/p>\n<h3 data-start=\"4843\" data-end=\"4870\">Anti-spam integrato<\/h3>\n<p data-start=\"4872\" data-end=\"4927\">WPForms ha opzioni integrate per proteggere dallo spam:<\/p>\n<ul data-start=\"4929\" data-end=\"5033\">\n<li data-start=\"4929\" data-end=\"4948\">\n<p data-start=\"4931\" data-end=\"4948\">reCAPTCHA v2 o v3<\/p>\n<\/li>\n<li data-start=\"4949\" data-end=\"4985\">\n<p data-start=\"4951\" data-end=\"4985\">hCaptcha (alternativa <a href=\"https:\/\/soccorsowp.it\/blog\/automattic-e-beeper-unalleanza-per-rivoluzionare-la-messaggistica\/\">open source<\/a>)<\/p>\n<\/li>\n<li data-start=\"4986\" data-end=\"5033\">\n<p data-start=\"4988\" data-end=\"5033\">Filtro antispam basato su honeypot invisibile<\/p>\n<\/li>\n<\/ul>\n<p data-start=\"5035\" data-end=\"5100\">Puoi attivarli facilmente dalle impostazioni generali del plugin.<\/p>\n<h3 data-start=\"5102\" data-end=\"5137\">Aggiungere il modulo al sito<\/h3>\n<p data-start=\"5139\" data-end=\"5258\">Puoi usare il <strong data-start=\"5153\" data-end=\"5171\">blocco WPForms<\/strong> nell\u2019editor a blocchi di WordPress oppure copiare lo shortcode e incollarlo dove vuoi.<\/p>\n<h2 data-start=\"5265\" data-end=\"5299\">Quale scegliere?<\/h2>\n<p data-start=\"5301\" data-end=\"5385\">Entrambi i plugin ti permettono di creare un <strong data-start=\"5346\" data-end=\"5384\">modulo contatto WordPress perfetto<\/strong>.<\/p>\n<ul data-start=\"5387\" data-end=\"5627\">\n<li data-start=\"5387\" data-end=\"5523\">\n<p data-start=\"5389\" data-end=\"5523\"><strong data-start=\"5389\" data-end=\"5407\">Contact Form 7<\/strong> \u00e8 ideale se vuoi <strong data-start=\"5425\" data-end=\"5449\">massima flessibilit\u00e0<\/strong>, conosci un minimo di codice e desideri un plugin <strong data-start=\"5500\" data-end=\"5522\">leggero e gratuito<\/strong>.<\/p>\n<\/li>\n<li data-start=\"5524\" data-end=\"5627\">\n<p data-start=\"5526\" data-end=\"5627\"><strong data-start=\"5526\" data-end=\"5537\">WPForms<\/strong> \u00e8 perfetto se vuoi <strong data-start=\"5557\" data-end=\"5606\">velocit\u00e0, semplicit\u00e0 visiva e pi\u00f9 automazioni<\/strong> senza troppi sforzi.<\/p>\n<\/li>\n<\/ul>\n<p data-start=\"5629\" data-end=\"5827\">In ogni caso, <strong data-start=\"5643\" data-end=\"5694\">avere un modulo contatto sul tuo sito \u00e8 un must<\/strong>. Ti permette di essere contattato, di ricevere richieste, feedback o preventivi&#8230; insomma, <strong data-start=\"5787\" data-end=\"5826\">ti connette con chi ti sta cercando<\/strong>.<\/p>\n<p data-start=\"5829\" data-end=\"5915\" data-is-last-node=\"\" data-is-only-node=\"\">E tu, quale sceglierai? Se vuoi, posso anche aiutarti a personalizzarlo nel dettaglio!<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/article>\n","protected":false},"excerpt":{"rendered":"<p>Perch\u00e9 avere un modulo contatto su WordPress \u00e8 fondamentale Se stai costruendo il tuo sito web WordPress, uno dei primi strumenti che dovresti inserire \u00e8&#8230;<\/p>\n","protected":false},"author":1,"featured_media":25575,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_seopress_robots_primary_cat":"none","_seopress_titles_title":"Modulo contatto WordPress %%sep%% %%sitetitle%%","_seopress_titles_desc":"Scopri come creare e personalizzare un modulo contatto WordPress con Contact Form 7 e WPForms. Guida semplice e completa","_seopress_robots_index":"","footnotes":""},"categories":[741],"tags":[1681,1680,1683,1679,1682],"class_list":{"0":"post-19649","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-plugin","8":"tag-contact-form-7","9":"tag-creare-modulo-wordpress","10":"tag-modulo-contatto-anti-spam","11":"tag-modulo-contatto-wordpress","12":"tag-wpforms"},"_links":{"self":[{"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/posts\/19649","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/comments?post=19649"}],"version-history":[{"count":0,"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/posts\/19649\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/media\/25575"}],"wp:attachment":[{"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/media?parent=19649"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/categories?post=19649"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/soccorsowp.it\/blog\/wp-json\/wp\/v2\/tags?post=19649"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}