In questo articolo, inizieremo discutendo il motivo per cui potreste voler creare i form di Elementor. Poi vi spiegheremo come fare e presenteremo alcuni utili add-on e suggerimenti per la risoluzione dei problemi. Cominciamo!<\/p>\n
Perch\u00e9 Creare Form con Elementor<\/h2>\n
Ci sono molti vantaggi nel creare form per il vostro sito WordPress<\/a>. Per cominciare, potete fornire alle persone che lo visitano un metodo rapido e semplice per comunicare con voi. Inoltre, potete usarli per generare lead e acquisire informazioni importanti dal vostro pubblico.<\/p>\n I form possono anche essere strumenti utili per far registrare i vostri utenti e accettare pagamenti. Tuttavia, se volete aggiungere un modulo al vostro sito WordPress, dovrete usare un plugin<\/a>. In alternativa, \u00e8 possibile utilizzare un page builder come Elementor.<\/p>\n Elementor vi permette di costruire form stupefacenti senza toccare una riga di codice<\/a>. Potete usare l’editor drag-and-drop per creare form reattivi che corrispondono al vostro branding e all’estetica del sito.<\/p>\n Potete anche scegliere tra multipli tipi di form<\/a>, tra cui:<\/p>\n Come potete vedere, ognuno di questi form ha il suo caso d’uso specifico e pu\u00f2 aiutare a migliorare la funzionalit\u00e0 del vostro sito. Successivamente, vi mostreremo come costruire un modulo di contatto con Elementor.<\/p>\n\n Ora che abbiamo capito meglio perch\u00e9 potreste voler usare i form di Elementor, diamo un’occhiata a come potete crearne uno in pochi semplici passi. Per questo tutorial, assumiamo che abbiate gi\u00e0 Elementor installato e attivato sul vostro sito web.<\/p>\n Esiste sia uno strumento gratuito<\/a> che un plugin a pagamento<\/a>. Per accedere alle funzioni del modulo, avrete bisogno della versione premium.<\/p>\n Per iniziare, andate alla pagina o all\u2019articolo dove volete inserire il vostro modulo di contatto. Poi fate clic sul pulsante Modifica con Elementor<\/strong> nella parte superiore dello schermo:<\/p>\n Questo lancer\u00e0 l’interfaccia dell’editor di Elementor. Dai widget sulla sinistra, cercate e selezionate il widget Modulo<\/strong>:<\/p>\n Poi potete trascinare e rilasciare il widget sulla vostra pagina. Questo inserir\u00e0 un modulo di contatto standard.<\/p>\n Una volta posizionato il modulo di contatto sulla pagina, ci sono una manciata di impostazioni da configurare. Per ora, concentriamoci sull’impostazione dei campi del modulo.<\/p>\n Potete modificare i campi base del modulo facendo clic sul widget e personalizzando il testo (se volete cambiare una delle opzioni predefinite). Se volete aggiungere altri campi, potete farlo selezionando Aggiungi elemento<\/strong>:<\/p>\n Potete selezionare il tipo di campo che volete aggiungere dall’elenco a discesa. Poi potete aggiungere un’etichetta, che \u00e8 il nome del campo del modulo. Questo mostra alle persone che visitano il sito quale input \u00e8 previsto.<\/p>\n Per l’opzione Placeholder<\/strong>, potete personalizzare il testo che appare nel campo del modulo prima che l’utente inserisca le sue informazioni. Potete usarlo per dare ai visitatori esempi dei dati che volete che forniscano.<\/p>\n Inoltre, potete scegliere di abilitare l’impostazione Richiesta<\/strong> e modificare la larghezza della colonna. Potete anche fare clic sul pannello Pulsanti<\/strong> per personalizzare l’aspetto dei pulsanti del vostro modulo. Potete cambiare le dimensioni cos\u00ec come il carattere e i colori.<\/p>\n Dopo aver finito di creare i campi del modulo, il passo successivo \u00e8 quello di configurare le impostazioni di invio del modulo. Potete navigare su Email<\/strong> nell’editor di Elementor per accedere alle numerose opzioni.<\/p>\n Per esempio, potete inserire il vostro indirizzo email nel campo A<\/strong> dove volete che siano consegnati gli invii. Potete inserire pi\u00f9 indirizzi email se lo desiderate:<\/p>\n Potete anche personalizzare l’oggetto dell’email e il messaggio. Quando avete finito di configurare tutte le opzioni, assicuratevi di salvare le modifiche.<\/p>\n Se volete personalizzare ulteriormente il vostro modulo di contatto, potete farlo abilitando i testi personalizzati. Selezionate Opzioni aggiuntive<\/strong>, quindi spostare l’interruttore di Messaggio personalizzato <\/strong> sul S\u00ec<\/strong>:<\/p>\n Ci sono quattro tipi di messaggi che potete modificare:<\/p>\n Potete personalizzare questi messaggi per abbinare la voce e lo stile del vostro brand. Per esempio, potete modificare il testo per aggiungere un po’ di personalit\u00e0.<\/p>\n Una volta che avete rivisto i testi e i campi base del vostro modulo, potete iniziare a personalizzare il design<\/a> del vostro modulo di contatto Elementor. Per esempio, potreste voler fare in modo che corrisponda al vostro brand.<\/p>\n Per iniziare, potete fare clic sulla scheda Stile<\/strong> in alto nell’editor dei widget:<\/p>\n Qui troverete una grande variet\u00e0 di opzioni e impostazioni che potete usare per personalizzare il design del vostro modulo di contatto. Per esempio, potete regolare la spaziatura e il padding, cos\u00ec come cambiare i colori, le dimensioni, le etichette e i pulsanti.<\/p>\n Quando l’aspetto e il contenuto del vostro modulo di contatto Elementor vi soddisfano, l’unica cosa che resta da fare \u00e8 salvarlo e pubblicarlo. Potete farlo selezionando il pulsante Pubblica<\/strong> in basso a sinistra dello schermo.<\/p>\n Questo \u00e8 tutto! Poi potete vedere in anteprima il vostro modulo di contatto sul front-end per confermare che l\u2019aspetto sia proprio quello che volete.<\/p>\n Di base, il page builder di Elementor include un sacco di opzioni per costruire form per il vostro sito WordPress. Tuttavia, potreste anche considerare l’aggiunta di plugin per aiutare a estendere la funzionalit\u00e0 dei vostri form. Diamo un’occhiata ad alcune opzioni.<\/p>\n Il plugin Master Addons for Elementor<\/a> \u00e8 uno strumento freemium che offre una collezione di strumenti utili per migliorare il page builder e, a sua volta, il vostro sito web. Include le seguenti caratteristiche:<\/p>\n \u00c8 anche compatibile con un’ampia variet\u00e0 di plugin di form. Questo include Contact Form 7, Ninja Forms, WP Forms e Caldera Forms. Per accedere a tutte le caratteristiche del plugin, \u00e8 necessario acquistare la versione pro<\/a>, che \u00e8 disponibile per 39 dollari all’anno.<\/p>\n Un altro strumento utile che potete usare con Elementor \u00e8 The Plus Addons<\/a>. Questo plugin contiene oltre 8.000 opzioni di personalizzazione e oltre 300 blocchi di interfaccia utente (UI) che possono aiutarvi a creare e progettare le vostre pagine e form con facilit\u00e0.<\/p>\n Le sue caratteristiche includono:<\/p>\n Ci sono anche pi\u00f9 di 18 modelli tra cui scegliere. Questi sono stati progettati specificamente per alcuni tipi di attivit\u00e0, tra cui agenzie, ristoranti, saloni e altro.<\/p>\n \u00c8 disponibile una versione gratuita. Tuttavia, per sfruttare l’intera suite di funzioni utili, vi consigliamo di acquistare una licenza premium<\/a> per 39 dollari all’anno.<\/p>\n Se volete creare form di contatto Elementor per il vostro sito WordPress senza pagare una licenza premium, ci sono diversi modi per farlo. Ci\u00f2 richieder\u00e0 di accoppiare il page builder con un altro plugin per form WordPress, come WPForms<\/a> o Formidable Forms<\/a>.<\/p>\n Diciamo che optate per Formidable Forms. Una volta installato e attivato il plugin sul vostro sito, potete navigare su Formidable<\/strong> > Forms <\/strong>> Add New<\/strong>:<\/p>\n Successivamente, selezionate Contact Form<\/strong> dall’elenco delle opzioni, e scegliete tra i modelli predefiniti. Quando avete finito di costruire il vostro modulo, andate alla pagina in cui volete inserirlo e lanciate l’interfaccia dell’editor di Elementor.<\/p>\n Dal pannello di sinistra, cercate e selezionate il widget Formidable Forms<\/strong>. Potete regolare il formato, i colori, i pulsanti, il testo, ecc:<\/p>\n Quando avete finito, potete salvare e pubblicare le vostre modifiche. Questo metodo richiede un po’ pi\u00f9 di tempo e sforzo di quanto sarebbe necessario con il plugin Elementor Pro. Tuttavia, pu\u00f2 aiutarvi a risparmiare un po’ di soldi se non volete acquistare un piano premium.<\/p>\n I form di contatto di Elementor sono abbastanza semplici e facili da usare. Tuttavia, potreste incorrere in problemi quando lo usate. Uno dei problemi pi\u00f9 comuni che le persone riportano sono le email non consegnate.<\/p>\n Elementor usa la funzione wp_mail per distribuire le sue email. Questo significa che il vostro hosting provider<\/a> prende l’email inviata e la distribuisce.<\/p>\n Tuttavia, alcuni host disabilitano la funzione PHP che \u00e8 tipicamente utilizzata per l’invio di email, motivo per cui questo problema pu\u00f2 verificarsi. Per risolvere questo errore, vi consigliamo di mettervi in contatto con il vostro fornitore di hosting e chiedere di abilitare la funzione send_mail.<\/p>\n In alternativa, potete usare un server SMTP (Simple Mail Transfer Protocol). Questo \u00e8 un server di posta elettronica<\/a> che instrada le vostre email in form alla casella di posta dei vostri clienti, usando una fonte esterna come Gmail. Questo pu\u00f2 ridurre le possibilit\u00e0 che le vostre email finiscano nelle cartelle di spam. Per impostare SMTP, potete usare un plugin come WP MAIL SMTP<\/a>.<\/p>\n\n I form giocano un ruolo fondamentale nei siti web. Permettono ai clienti di mettersi in contatto con voi, registrare un account, inviare informazioni di pagamento e molto altro. Tuttavia, capire come progettare form esteticamente piacevoli per il vostro sito pu\u00f2 essere impegnativo. Per fortuna Elementor semplifica le cose.<\/p>\n Una volta aggiunto il widget del modulo di Elementor alla vostra pagina, potete impostare i vostri campi e configurare le impostazioni del modulo. Potete anche personalizzare il design del vostro modulo in modo che si allinei con il vostro brand.<\/p>\n Avete qualche domanda sulla creazione di form Elementor in WordPress? Fatecelo sapere nella sezione commenti qui sotto!<\/p>\n","protected":false},"excerpt":{"rendered":" Quando si ha un sito web aziendale, i form sono un punto fermo. Rendono pi\u00f9 facile per i clienti entrare in contatto con voi e fornire …<\/p>\n","protected":false},"author":117,"featured_media":53329,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[25564,25840],"topic":[25873],"class_list":["post-53328","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-elementor","tag-forms","topic-sviluppo-wordpress"],"yoast_head":"\n\n
Come Creare un Modulo di Contatto Elementor in WordPress (in 6 Passaggi)<\/h2>\n
Passo 1: Aggiungere il Widget di Contatto di Elementor<\/h3>\n
![\"Editor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/edit-with-elementor.png\")
![\"Il](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-form-widget.jpg\")
Passo 2: Impostare i Campi del Modulo di Contatto<\/h3>\n
![\"Editor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/add-item.jpg\")
Passo 3: Configurare gli Invii di Form<\/h3>\n
![\"Editor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/email-settings-elementor.png\")
Passo 4: Personalizzare i Testi del Modulo di Contatto<\/h3>\n
![\"Schermata](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/form-messages.png\")
\n
Passo 5: Dare uno Stile al Modulo di Contatto Elementor<\/h3>\n
![\"Editor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-form-style.jpg\")
Passo 6: Salvare e Pubblicare il Modulo<\/h3>\n
Migliori Add-on per i Form Elementor<\/h2>\n
Master Addons for Elementor<\/h3>\n
![\"Master](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/master-addons.png\")
\n
The Plus Addons<\/h3>\n
![\"The](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/plus-addons.png\")
\n
Altri Suggerimenti e Trucchi per Creare Form di Elementor<\/h2>\n
![\"Aggiungere](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/add-new-form.png\")
![\"Selezione](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/formidable-forms-elementor.jpg\")
Risoluzione dei Problemi con i Form Elementor<\/h2>\n
Riepilogo<\/h2>\n