Vuoi imparare a creare un modulo di caricamento file in Elementor?

Come probabilmente saprai, la versione pro di Elementor viene fornita con un widget Modulo che puoi utilizzare per creare forme sul tuo sito WordPress. Con questo widget puoi creare quasi ogni tipo di file forme. Ci sono circa 19 tipi di campo offerti da questo widget, incluso un campo per caricamento Un file.

In questo articolo, ti mostreremo come creare un modulo che consiste in un campo di caricamento file.

Ma prima di iniziare, assicurati di aver aggiornato la tua versione di Elementor alla versione Pro poiché, ancora una volta, il widget Form è disponibile solo su Elementor Pro.

Leggi la nostra guida su: Come installare Elementor su WordPress

Innanzitutto, crea una nuova pagina o pubblicala e modificala con Elementor.

Prima di iniziare a creare la pagina per aggiungere il modulo, definisci prima il layout. Per fare ciò, fai clic sull'icona a forma di ingranaggio nell'angolo in basso a sinistra del pannello di sinistra. Imposta il tuo layout preferito dal menu a discesa disposizione.

Aggiungi una nuova sezione facendo clic sull'icona più nella casella di modifica di Elementor. Puoi selezionare qualsiasi struttura in base al concetto di design che desideri creare. Scegliamo una struttura a colonna singola in questo esempio.

Aggiungi il widget Modulo trascinandolo dal pannello di sinistra all'area della tela.

Come creare un modulo in Elementor

Per impostazione predefinita, hai un modulo composto da tre campi: Nome, E-mail e Messaggio. Rimuovi un campo che non ti serve facendo clic sull'icona x sul campo.

In questo articolo creeremo un form composto da 4 campi: Nome, Email, Messaggio e Caricamento file. Poiché il modulo ha solo 3 campi per impostazione predefinita, è necessario aggiungere un nuovo modulo per il campo Caricamento file.

Leggi anche: Come aggiungere reCAPTCHA al tuo modulo Elementor

Fare clic sul pulsante AGGIUNGI UN ARTICOLO per aggiungere un nuovo campo. Definisci il tipo di campo su Carica file. Se vuoi definirlo come campo obbligatorio, attiva l'opzione Necessario. Imposta la dimensione massima del file dal menu a discesa su Dimensione massima del file.

Per definire i tipi di file consentiti, inserisci le estensioni dei file Tipi di file consentiti. Puoi accettare più tipi di file separando le estensioni dei file con una virgola. Se vuoi consentire ai tuoi visitatori di inviare più file, attiva l'opzione File multipli e imposta il numero massimo di file che possono scaricare.

Se desideri modificare l'ordine dei campi, puoi semplicemente trascinare ciascun campo verso l'alto o verso il basso. In questo esempio, posizioniamo il campo Caricamento file sopra il campo Messaggio.

Come creare un modulo di caricamento file in Elementor

Definizione di azione

Sarebbe fantastico se potessi connettere il tuo modulo Elementor con servizi di backend del modulo come getform ou Carrozzeria. Sfortunatamente, Elementor non supporta l'integrazione con alcun servizio di backend di moduli.

Scopri come: Come aggiungere un divisore per creare una sezione in Elementor

Quindi, in questo articolo, definiremo l'azione sull'e-mail. Ciò significa che gli invii inviati tramite il modulo verranno inviati tramite l'e-mail specificata.

Per impostazione predefinita, l'azione del modulo era impostata su e-mail. Puoi verificarlo dall'opzione Azioni dopo l'invio.

Quindi apri l'opzione E-mail e impostare l'indirizzo e-mail a cui verranno inviati gli invii del modulo. Definire anche l'oggetto dell'e-mail.

Come creare un modulo di caricamento file in Elementor

Sempre sotto l'opzione E-mail, imposta il corpo dell'email su opzione Messaggio.

Per personalizzare il corpo dell'e-mail, puoi incollare gli shortcode dei campi che desideri aggiungere al corpo. Li trovi nella scheda AVANZATE di ogni campo.

Puoi anche personalizzare i metadati del corpo della tua email nella sezione Meta Data. Rimuovi tutti i metadati che non vuoi includere.

Come creare un modulo di caricamento file in Elementor

I metadati stessi verranno visualizzati sotto il corpo dell'e-mail.

Nei campi da e-mail, Da Nome e Rispondi a, puoi lasciarli vuoti.

Personalizzazione del modulo

Finora, il tuo modulo è pronto per essere pubblicato. Prima di pubblicarlo, puoi personalizzare il modulo per renderlo più attraente. Per impostazione predefinita, ogni campo del modulo contiene un'etichetta. Se vuoi disattivarlo, puoi farlo da Opzione Campi modulo sous la scheda Contenuto.

Per creare opzioni di stile più avanzate, puoi accedere alla scheda Stile. Ecco alcune opzioni di stile che puoi impostare.

  • Definisci lo spazio tra le linee e la tipografia delle etichette

Per definire lo spazio tra le righe (campi) e la tipografia delle etichette, puoi aprire l'opzione Modulo.

Imposta l'interlinea sulla sezione Distanza tra le righe. Per definire la tipografia delle etichette (dimensione del carattere, stile del carattere e famiglia del carattere), è possibile fare clic sull'icona della matita di tipografia nella sezione Etichetta.

  • Definisci la tipografia del campo, il colore di sfondo, il colore del bordo, la larghezza del bordo e il raggio del bordo

Puoi aprire l'opzione Settore per definire la tipografia del controllo, il colore di sfondo del controllo, il colore del bordo, la larghezza del bordo e il raggio del bordo.

Come creare un modulo di caricamento file in Elementor
  • Pulsante Personalizza

Per personalizzare il pulsante, puoi aprire l'opzione Bottoni. Da lì puoi impostare il colore di sfondo, il colore del testo, la tipografia, il colore del bordo, il raggio del bordo, ecc ... Passa alla scheda HOVER per personalizzare il puntamento del pulsante.

Ci sono molte altre opzioni di personalizzazione che puoi impostare. Puoi giocare con il pannello di sinistra finché non sei soddisfatto dell'aspetto del tuo modulo. Una volta fatto, puoi fare clic sul pulsante PUBBLICARE per pubblicare il tuo modulo.

Potenziale errore

Quando si verifica il modulo, potrebbero essere visualizzati messaggi di errore. Di seguito è riportato un esempio di errore.

Come creare un modulo di caricamento file in Elementor

L'errore precedente si verifica in genere se si utilizza un servizioweb hosting condivisione. La maggior parte dei fornitori diweb hosting funzione di disabilitazione condivisa php invia_mail, che viene utilizzato dalla funzionalità di WordPress wp_mail per inviare e-mail.

Ottieni Elementor Pro ora!

Conclusione

Ecco ! Questo è tutto per questo articolo che ti mostra come creare un modulo di caricamento file in Elementor. Se hai dubbi su come arrivarci ffacci sapere in commentaires.

Tuttavia, puoi anche consultare le nostre risorse, se hai bisogno di più elementi per realizzare i tuoi progetti di creazione di siti Internet, consultando la nostra guida su Creazione di blog WordPress o quello acceso Divi: il miglior tema WordPress di tutti i tempi.

Ma nel frattempo, condividi questo articolo sui tuoi diversi social network.

...