MetForm offers a comprehensive set of form input fields for creating flexible and interactive WordPress forms. Each field can be customized with labels, placeholders, validation rules, and conditional logic to suit any form requirement.
Input Fields and Their Functions #
- Text Field: Collects single-line textual input from users.
- Email Field: Accepts and validates email addresses.
- Number Field: Allows numeric input with min, max, and step control.
- Telephone Field: Collects phone numbers in a structured format.
- Time Field: Lets users select a time, optionally in 24-hour format.
- Date Field: Enables date selection with optional range or date+time mode.
- Select (Dropdown) Field: Provides a single-choice dropdown menu.
- Multi-Select Field: Allows selection of multiple options from a list.
- Textarea Field: Captures multi-line text input from users.
- Checkbox Field: Lets users select one or more predefined options.
- Radio Field: Allows single-choice selection from multiple options.
- First Name Field: Captures the user’s first name.
- Last Name Field: Captures the user’s last name.
- GDPR Consent Field: Adds a checkbox for compliance with data privacy laws.
- Switch Field: Provides an on/off toggle for binary choices.
- URL Field: Accepts website URLs with validation.
- Password Field: Collects secure password input.
- Response Message: Displays success, error, or custom messages.
- Rating Field: Lets users rate items with stars or similar symbols.
- File Upload Field: Enables uploading of single or multiple files with type and size restrictions.
- Summary Field: Displays a summary of form data before submission.
- Pulsante Invia: Finalizes and submits the form.
Abbiamo entrambi Gratuito E Campo di immissione professionale for you. Here we’ll discuss the free input field, let’s start.
Campo di inserimento libero #
To make any form with Metform’s Free Input Fields, open the page/post you want to add the form. After that, start editing with Elementor.
Testo #
Add Text field to input Name or any type of text.
Contenuto #
- Show Label (Toggle): Turn the field label on/off.
- Position (Dropdown: Top / Left): Choose label position relative to the input.
- Label (Text Input): Text that appears as the field’s title.
- Name (Text Input – Required): Unique internal identifier without spaces.
- Placeholder (Text Input): Light text inside the field guiding the user.
- Help Text (Textarea): Instruction text displayed below the field.
- Default Value (Text Input): Pre-populates the field with a value.
- Required (Toggle): Makes the field mandatory for form submission.
Impostazioni #
- Field ID (Text Input): Custom HTML ID for styling or scripting.
- Width (Dropdown: 100% / 50% / Custom): Controls how much horizontal space the field uses.
- Read Only (Toggle): Prevents users from editing the text.
- Disabled (Toggle): Completely disables the field interaction.
Validation #
- Validation Type (Dropdown): Choose how the field’s value is validated.
- Per lunghezza del carattere: Enforce minimum/maximum characters.
- Per lunghezza della parola: Enforce min/max number of words.
- In base all'espressione: Custom regex pattern for validation.
- Required Message (Text Input): Custom message when required rule fails.
Logica condizionale #
- Enable Conditional Logic (Toggle): Enable dynamic show/hide behavior.
- Action (Dropdown: Show / Hide): Whether to show or hide based on conditions.
- Field (Dropdown): Field to compare against.
- Operator (Dropdown): Type of comparison (Equal / Not Equal / Contains / Greater / Less).
- Value (Text Input): Condition value to match.
Check out our Demo dal vivo qui.
E-mail #
Make sure that the user enters the valid email address to your Form with the Email Input field. Search the Metform email widget and drag and drop.
Contenuto #
- Show Label (Toggle): Display label or not.
- Position (Dropdown: Top / Left): Where the label appears.
- Label (Text Input): Field title text.
- Name (Text Input – Required): Unique field identifier.
- Placeholder (Text Input): Hint text inside the field.
- Help Text (Textarea): Instructional text under the field.
- Required (Toggle): Make email required to submit.
Impostazioni #
- Field ID (Text Input): For CSS/JS targeting.
- Width (Dropdown): How wide the field appears visually.
- Read Only (Toggle): Users can’t change the displayed email.
Check out our Demo dal vivo qui
Numero #
Questi campi di input garantiranno che gli utenti inseriscano un numero valido con input numerico.
Contenuto #
- Show Label (Toggle): Control label visibility.
- Position (Dropdown: Top / Left): Label placement.
- Label (Text Input): Number prompt text.
- Name (Text Input – Required): Unique identifier.
- Placeholder (Text Input): Default hint numeric text.
- Help Text (Textarea): Help text guiding input.
- Default Value (Number Input): Pre-set number in field.
- Required (Toggle): Mandatory numeric input.
Impostazioni #
- Min Value (Number Input): Smallest allowed number.
- Max Value (Number Input): Largest allowed number.
- Step (Number Input): Increment step for arrows/spinners.
- Read Only (Toggle): Prevent editing.
- Disabled (Toggle): Disable the control.
Check out our Demo dal vivo qui
Telefono #
Consenti agli utenti di fornire il proprio numero di telefono valido per effettuare connessioni.
Contenuto #
- Show Label (Toggle): Show/hide phone label.
- Position (Dropdown: Top / Left): Label layout.
- Label (Text Input): Field title text.
- Name (Text Input – Required): Field internal name.
- Placeholder (Text Input): Phone format example text.
- Help Text (Textarea): Additional instructions.
- Required (Toggle): Must be filled to submit.
Check out our Demo dal vivo qui
Tempo #
Aiuta gli utenti a selezionare l'orario preferito dal timer a discesa.
Contenuto #
- Show Label (Toggle): Enable/disable label.
- Position (Dropdown): Top/Left label position.
- Label (Text Input): Prompt for time.
- Name (Text Input): Internal time field name.
- Placeholder (Text Input): Time format hint.
- Help Text (Textarea): Extra instruction text.
- Required (Toggle): Mandatory time.
- Use 24H Format (Toggle): Option to use 24-hour instead of AM/PM.
Check out our Demo dal vivo qui.
Formato 24 ore #
Check out our Demo dal vivo qui
Data #
Utilizza questo campo di input per selezionare la data dal calendario a comparsa nel modulo per renderlo più facile da usare.
Contenuto #
Required (Toggle): Must select a date/time.
Show Label (Toggle): Toggle field label display.
Position (Dropdown): Choose label position.
Label (Text Input): Text shown as a title.
Name (Text Input): Unique field key.
Help Text (Textarea): Extra instructions.
Impostazioni #
- Range Date Input (Toggle): Enable two dates (start/end) instead of single.
- Min/Max Date (Date Picker): Earliest and latest selectable dates.
- Disable Dates (Date Picker): Block specific dates.
- Date Format (Dropdown): Choose format such as DD-MM-YYYY.
- Input Time (Toggle): Add time selection with date.
Check out our Demo dal vivo qui
Immissione dell'intervallo di date #
Check out our Demo dal vivo qui
Seleziona Data con immissione dell'ora #
Check out our Demo dal vivo qui
| Opzioni | Descrizione |
|---|---|
| Mostra etichetta | Attiva/disattiva l'etichetta. |
| Posizione | Predefinito: Superiore Seleziona la posizione dell'etichetta. dove vuoi vederlo. in alto o a sinistra dell'ingresso. |
| Etichetta | Digitare il testo dell'etichetta. |
| Nome | Il nome è obbligatorio. Inserisci un nome senza spazi o caratteri speciali. utilizzare solo il carattere di sottolineatura/trattino (_/-) per più parole. Il nome deve essere diverso. |
| Segnaposto | Utilizza il segnaposto per mostrare del testo fittizio e aiutare l'utente a inserire il testo corretto. |
| Testo guida | Digita il testo da mostrare sotto il widget. |
| Necessario | Predefinito: NO Attiva/disattiva questa opzione per renderla obbligatoria. Gli utenti non possono inviare i moduli senza compilare i campi obbligatori. |
| Imposta la data minima o massima | Fornire la data minima e massima |
| Disabilita data | Inserisci la data di chiusura o la data di disattivazione |
| Immissione data intervallo | Abilita l'immissione della data nell'intervallo Abilita o disabilita l'immissione dell'intervallo di date, l'immissione della data in base alla data, all'anno o al mese. Formato data: seleziona Formato data dal menu a discesa. Ad esempio: GG-MM-AAAA |
| Tempo di ingresso | Puoi aggiungere l'ora con la data. |
| Logica condizionale | Mostra/nascondi questo campo in base a determinati criteri. |
Selezionare #
Aggiungi un elenco a discesa di opzioni tra cui gli utenti possono scegliere, cerca il widget in base al nome, quindi trascina e rilascia il widget nella posizione desiderata.
Contenuto #
- Required (Toggle): Must pick an option.
- Show Label (Toggle): Display the label.
- Position (Dropdown): Position of label.
- Label (Text Input): Dropdown title.
- Name (Text Input – Required): Internal field name.
- Help Text (Textarea): Supporting info text.
- Dropdown List (Repeater):
- Option Text: User sees this option.
- Option Value: Value sent/stored after submit.
- Status (Dropdown: Enable/Disable): Options can be disabled.
- Default Selected (Toggle): Make this option selected by default.
Check out our Demo dal vivo qui
Opzione di ricerca come etichetta #
Check out our Demo dal vivo qui
Selezione multipla #
Seleziona più elementi alla volta dal menu a discesa.
(Same as Select, but allows selecting multiple options from the list.)
Multiple Selection (Toggle): Allow multiple items to be chosen.
Check out our Demo dal vivo qui
Valori selezionati predefiniti #
Check out our Demo dal vivo qui
Area di testo #
Aiuta ad aggiungere un gran numero di contenuti, revisioni, commenti al tuo modulo.
(Much like Text, but supports multiple lines.)
Contenuto #
- Rows (Number Input): Controls visible height of textarea.
- Show Label, Position, Label, Name, Help Text, Required: Same as text.
Check out our Demo dal vivo qui
Casella di controllo #
Consenti agli utenti di selezionare più elementi contemporaneamente nel tuo modulo con la casella di controllo.
Contenuto #
- Show Label (Toggle), Position (Dropdown), Label, Name: Standard label controls.
- Checkbox Options (Repeater):
- Option Text: Text shown next to checkbox.
- Option Value: Stored when submitted.
- Status (Dropdown: Enable / Disable): Active or disabled option.
- Required (Toggle): Must check at least one.
Schermo #
Layout (Dropdown: Vertical / Inline): Arrange options layout.
Check out our Demo dal vivo qui
Verticale #
Check out our Demo dal vivo qui
Posizione dell'icona dopo il testo #
Check out our Demo dal vivo qui
Radio #
Consenti agli utenti di selezionare solo un elemento esclusivo tra più opzioni.
Contenuto #
- Required (Toggle): Must choose an option.
- Show Label, Position, Label, Name: Label settings.
- Option Display (Dropdown: Vertical / Horizontal): Choose orientation.
- Options Text Position (Dropdown: Before / After): Where the label sits relative to the circle.
- Radio Options (Repeater):
- Radio Option Text: Label shown to user.
- Radio Value: Value saved upon submit.
- Status (Dropdown): Active/disabled option.
Check out our Demo dal vivo qui
Verticale #
Check out our Demo dal vivo qui
Posizione dell'icona dopo il testo #
Check out our Demo dal vivo qui
Nome (elenco) #
Allow users to give their First Name to show them in a listing method on the mailing list. For Example : Mailchimp
Contenuto #
- Validation Type (Dropdown): Min/max or expression validation for names.
- Show Label (Toggle), Position (Dropdown), Label: As standard.
- Placeholder (Text Input): Name hint.
- Testo guida: Additional instructions.
- Required (Toggle): Must fill.
Cognome (Inserzione) #
Allow users to give their LastName to show them in a listing method on the mailing list. For Example : Mailchimp
Same controls as First Name.
Attiva l'elenco #
Utilizza il campo di attivazione del modulo e rendi il tuo utente come utente di contatto mailchimp iscritto facendo clic sulla casella di controllo "Iscriviti alla nostra newsletter".
Check out our Demo dal vivo qui
| Opzioni | Descrizione |
|---|---|
| Mostra etichetta | Attiva/disattiva l'etichetta. |
| Posizione | Predefinito: Superiore Seleziona la posizione dell'etichetta. dove vuoi vederlo. in alto o a sinistra dell'ingresso. |
| Etichetta di ingresso | Digitare il testo dell'etichetta. |
| Visualizzazione delle opzioni | Visualizza l'opzione di attivazione dell'elenco Orizzontalmente O Verticalmente |
| Opzioni Posizione testo | Opzione di visualizzazione nell'elenco Opzione Posizione testo: Prima Casella di controllo o Dopo Casella di controllo |
| Testo opzione casella di controllo | Fornire informazioni sulle opzioni che verranno mostrate all'utente. Per esempio: "Iscriviti alla nostra Newsletter“ |
| Testo guida | Digita il testo da mostrare sotto il widget. Indirizza e consegna facilmente i messaggi alle persone giuste con il testo di aiuto |
| Necessario | Predefinito: NO Attiva/disattiva questa opzione per renderla obbligatoria. Gli utenti non possono inviare i moduli senza compilare i campi obbligatori. |
| Logica condizionale | Mostra/nascondi questo campo in base a determinati criteri. |
Consenso GDPR #
Abilita i reclami GDPR (Regolamento generale sulla protezione dei dati) nel tuo modulo prima di raccogliere i dati dell'utente in quanto spiega come utilizzi solitamente i dati dell'utente per proteggerti dalle azioni della legge.
Contenuto #
- Help Text (Textarea): Further explanation.
- Show Label (Toggle): Display consent block title.
- Position (Dropdown): Label placement.
- Input Label (Text Input): Consent prompt text.
- Option Display (Dropdown): Horizontal/vertical layout.
- Options Text Position (Dropdown): Label before/after checkbox.
- Checkbox Option Text (Textarea): Consent statement text.
Controllo out our Demo dal vivo qui
Con collegamento testuale #
Controllo out our Demo dal vivo qui
Interruttore #
Controlla facilmente l'ingresso della casella di controllo Sì/No o On/Off dell'interruttore a levetta proprio come un interruttore della luce.
Contenuto #
- Required (Toggle): Must select a state.
- Show Label (Toggle), Position (Dropdown), Label, Name: Standard label controls.
- Help Text (Textarea): Description below switch.
- Active/Inactive Text (Text Inputs): Custom labels for on/off states.
Check out our Demo dal vivo qui
Testo opzione personalizzata #
Check out our Demo dal vivo qui
reCAPTCHA #
Ti consente di integrare Google reCAPTCHA per proteggere il tuo sito da spam indesiderato e traffico abusivo.
Check out our Demo dal vivo qui
| Opzioni | Descrizione |
|---|---|
| configurazione reCAPTCHA | Attiva reCAPTCHA dalle impostazioni. Quindi devi configurare il sito reCAPTCHA e la chiave segreta da MetForm -> Impostazioni da qui. Vedi la documentazione. |
ReCAPTCHA semplice #
Protegge il tuo sito da bot indesiderati e spam.
Check out our Demo dal vivo qui
Opzioni in linea #
Check out our Demo dal vivo qui
| Opzioni | Descrizione |
|---|---|
| Mostra etichetta | Attiva/disattiva l'etichetta. |
| Posizione | Predefinito: Superiore Seleziona la posizione dell'etichetta. dove vuoi vederlo. in alto o a sinistra dell'ingresso. |
| Inserisci la visualizzazione CAPTCHA | Inserisci il tuo reCAPTCHA in un blocco o mostra il campo di input in una riga. |
| Etichetta | Digitare il testo dell'etichetta. |
| Testo guida | Digita il testo da mostrare sotto il widget. |
Dispositivo di scorrimento della portata #
Imposta il valore dell'intervallo massimo o minimo sul modulo utilizzando il fantastico cursore Intervallo. Tutto quello che devi fare è semplicemente trascinare entrambe le estremità finché non arriva il valore appropriato.
Check out our Demo dal vivo qui
Valore di default #
Controllo out our Demo dal vivo qui
Ingresso multi-intervallo #
Controllo out our Demo dal vivo qui
| Opzioni | Descrizione |
|---|---|
| Mostra etichetta | Attiva/disattiva l'etichetta. |
| Posizione | Predefinito: Superiore Seleziona la posizione dell'etichetta. dove vuoi vederlo. in alto o a sinistra dell'ingresso. |
| Etichetta | Digitare il testo dell'etichetta. |
| Nome | Il nome è obbligatorio. Inserisci un nome senza spazi o caratteri speciali. utilizzare solo il carattere di sottolineatura/trattino (_/-) per più parole. Il nome deve essere diverso. |
| Testo guida | Digita il testo da mostrare sotto il widget. |
| Necessario | Predefinito: NO Attiva/disattiva questa opzione per renderla obbligatoria. Gli utenti non possono inviare i moduli senza compilare i campi obbligatori. |
| Lunghezza minima | Impostare il valore Intervallo minimo |
| Lunghezza massima | Impostare il valore dell'intervallo massimo |
| Valore di default | Imposta il valore predefinito, utilizza la virgola per impostare il valore dell'intervallo |
| Passi | Aggiungi il valore dei passaggi per aggiungere l'intervallo passo dopo passo |
| Immettere come intervallo | Attiva o disattiva questa opzione per impostare l'intervallo richiesto o meno |
| Logica condizionale | Mostra/nascondi questo campo in base a determinati criteri. |
URL #
Aggiungi semplicemente l'URL al tuo modulo utilizzando il nostro campo di immissione URL. Garantisce che gli utenti inseriscano un URL valido nel campo del modulo.
Contenuto #
- Show Label, Position, Label, Name: Standard label controls.
- Placeholder (Text): Sample URL hint.
- Testo guida: Extra instructions.
- Required (Toggle): Must enter a valid URL.
Validation #
URL Validation: Ensures submission is a valid link.
Check out our Demo dal vivo qui
Parola d'ordine #
Se desideri che il tuo utente fornisca una password complessa, utilizza il nostro campo di immissione password. Garantisce che gli utenti ricevano una password protetta e possano essere in grado di modificarla quando necessario.
Contenuto #
- Show Label, Position, Label, Name: Standard label controls.
- Segnaposto: Password hint text.
- Testo guida: Instruction text below field.
- Required (Toggle): Must enter password.
Validation #
Validation Type (Dropdown): Enforce strength via characters/words/regex.
Check out our Demo dal vivo qui
Messaggio di risposta #
Contenuto #
- Add Success Message (Textarea): Text shown after successful submission.
Check out our Demo dal vivo qui:
Valutazione #
Raccogli le valutazioni dei clienti con Valutazione campo di input, cerca il campo di input in base al nome, quindi trascina e rilascia il campo di input nella posizione desiderata. Aiuta a ottenere la recensione dei clienti e a creare un buon legame tra proprietario e cliente.
Contenuto #
- Number of Rating Stars (Number Input): Custom number of stars to display.
- Show Label (Toggle), Position (Dropdown), Label, Name: Standard.
- Testo guida: Rating instruction beneath stars.
- Required (Toggle): Must choose a rating.
Check out our Demo dal vivo qui:
Qualsiasi numero di stelle #
Check out our Demo dal vivo qui
Upload di file #
Metform rende molto facile l'aggiunta Upload di file widget nei tuoi moduli, cerca il campo di input in base al nome, quindi trascina e rilascia il campo di input nella posizione desiderata.
Contenuto #
- Multiple Upload (Toggle): Allow uploading more than one file.
- Show Label (Toggle), Position (Dropdown), Label, Name: Label settings.
- Testo guida: Guidance under uploader.
- Required (Toggle): Must upload.
- Allowed File Types (Text Input/List): Specify extensions such as
.jpg, .png. - Max File Size (Number Input): Maximum allowed file size.
Check out our Demo dal vivo qui
Riepilogo #
Fornisci un riepilogo prima dell'iscrizione per instaurare una buona comunicazione con il tuo cliente.
Contenuto #
- Required (Toggle): Must review before submit.
- Show Label (Toggle), Position (Dropdown), Label, Name: Standard.
- Testo guida: Explanation under summary.
Logica condizionale #
- Enable Conditional Logic (Toggle): Enable show/hide rules.
- Action (Dropdown: Show / Hide): Visibility setting.
- Field (Dropdown: Select Field): Field controlling summary visibility.
- Operator (Dropdown: Equal / Not Equal / Contains): Comparison type.
- Value (Text Input / Option Selector): Value triggering summary display.
Pulsante Invia #
Invia il modulo con questo campo e archivia i dati nel back-end.
Contenuto #
- Label (Text Input): Text shown on Submit button.
- Button Alignment (Dropdown: Left / Center / Right): Position submit button in form.
- Icon (Icon Picker): Choose an icon to accompany the text.
- Icon Position (Dropdown: Before / After): Place icon relative to text.
- Class (Text Input): Add a CSS class for styling.
- ID (Text Input): Add a CSS ID for scripting.
Impostazioni #
Hidden (Toggle): Hidden input not visible but stored for backend.
Logica condizionale #
- Enable Conditional Logic (Toggle): Activate dynamic display.
- Action (Dropdown: Show / Hide): Decide if submit button appears.
- Field (Dropdown: Select Field): Field controlling submit button visibility.
- Operator (Dropdown: Equal / Not Equal / Contains / Not Contains): Comparison type.
- Value (Text Input / Option Selector): Value triggering the button display.
