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.
- Przycisk Prześlij: Finalizes and submits the form.
Mamy oba Bezpłatny I Profesjonalne pole wejściowe for you. Here we’ll discuss the free input field, let’s start.
Wolne pole wejściowe #
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.
Tekst #
Add Text field to input Name or any type of text.
Treść #
- 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.
Ustawienia #
- 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.
- Według długości znaku: Enforce minimum/maximum characters.
- Według długości słowa: Enforce min/max number of words.
- Na podstawie wyrażenia: Custom regex pattern for validation.
- Required Message (Text Input): Custom message when required rule fails.
Logika warunkowa #
- 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 na żywo tutaj.
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.
Treść #
- 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.
Ustawienia #
- 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 na żywo tutaj
Numer #
Te pola wejściowe zapewnią, że użytkownicy wprowadzą prawidłowy numer za pomocą danych numerycznych.
Treść #
- 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.
Ustawienia #
- 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 na żywo tutaj
Telefon #
Zezwalaj użytkownikom na podawanie prawidłowego numeru telefonu w celu nawiązywania połączeń.
Treść #
- 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 na żywo tutaj
Czas #
Pomaga użytkownikom wybrać preferowany czas z wyskakującego timera.
Treść #
- 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 na żywo tutaj.
Format 24-godzinny #
Check out our Demo na żywo tutaj
Data #
Użyj tego pola wejściowego, aby wybrać datę z wyskakującego kalendarza do formularza, aby uczynić go bardziej przyjaznym dla użytkownika.
Treść #
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.
Ustawienia #
- 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 na żywo tutaj
Wprowadzanie zakresu dat #
Check out our Demo na żywo tutaj
Wybierz datę z wprowadzeniem godziny #
Check out our Demo na żywo tutaj
| Opcje | Opis |
|---|---|
| Pokaż etykietę | Włącz/wyłącz etykietę. |
| Pozycja | Domyślny: Szczyt Wybierz położenie etykiety. gdzie chcesz to zobaczyć. u góry lub na lewo od wejścia. |
| Etykieta | Wpisz tekst etykiety. |
| Nazwa | Imię i nazwisko jest wymagane. Wpisz nazwę bez spacji i znaków specjalnych. w przypadku wielu słów używaj tylko podkreślenia/łącznika (_/-). Nazwa musi być inna. |
| Uchwyt miejsca | Użyj symbolu zastępczego, aby wyświetlić fikcyjny tekst i pomóc użytkownikowi wstawić poprawny tekst. |
| Tekst pomocy | Wpisz tekst, który będzie wyświetlany pod widżetem. |
| Wymagany | Domyślny: NIE Przełącz tę opcję, aby była wymagana. Użytkownicy nie mogą przesłać formularzy bez wypełnienia wymaganych pól. |
| Ustaw minimalną lub maksymalną datę | Podaj minimalną i maksymalną datę |
| Wyłącz datę | Wprowadź datę zamknięcia lub wyłącz datę |
| Zakres wprowadzania daty | Włącz zakres wprowadzania daty Włącz lub wyłącz zakres wprowadzania daty, data Wprowadź datę, rok lub miesiąc. Format daty: wybierz Format daty z listy rozwijanej. Na przykład: DD-MM-RRRR |
| Czas wprowadzania | Możesz dodać godzinę wraz z datą. |
| Logika warunkowa | Pokaż/ukryj to pole w oparciu o określone kryteria. |
Wybierać #
Dodaj rozwijaną listę opcji do wyboru przez użytkowników, wyszukaj widżet według jego nazwy, a następnie przeciągnij i upuść widżet w żądanej lokalizacji.
Treść #
- 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 na żywo tutaj
Opcja wyszukiwania jako etykieta #
Check out our Demo na żywo tutaj
Wielokrotny wybór #
Wybierz jednocześnie wiele elementów z listy rozwijanej.
(Same as Select, but allows selecting multiple options from the list.)
Multiple Selection (Toggle): Allow multiple items to be chosen.
Check out our Demo na żywo tutaj
Domyślne wybrane wartości #
Check out our Demo na żywo tutaj
Obszar tekstowy #
Pomaga dodać dużą liczbę treści, przejrzeć i skomentować formularz.
(Much like Text, but supports multiple lines.)
Treść #
- Rows (Number Input): Controls visible height of textarea.
- Show Label, Position, Label, Name, Help Text, Required: Same as text.
Check out our Demo na żywo tutaj
Pole wyboru #
Zezwalaj użytkownikom na jednoczesne wybieranie wielu elementów formularza za pomocą pola wyboru.
Treść #
- 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.
Wyświetlacz #
Layout (Dropdown: Vertical / Inline): Arrange options layout.
Check out our Demo na żywo tutaj
Pionowy #
Check out our Demo na żywo tutaj
Pozycja ikony po tekście #
Check out our Demo na żywo tutaj
Radio #
Pozwól użytkownikom wybrać tylko jeden ekskluzywny przedmiot z wielu opcji.
Treść #
- 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 na żywo tutaj
Pionowy #
Check out our Demo na żywo tutaj
Pozycja ikony po tekście #
Check out our Demo na żywo tutaj
Imię (lista) #
Allow users to give their First Name to show them in a listing method on the mailing list. For Example : Mailchimp
Treść #
- Validation Type (Dropdown): Min/max or expression validation for names.
- Show Label (Toggle), Position (Dropdown), Label: As standard.
- Placeholder (Text Input): Name hint.
- Tekst pomocy: Additional instructions.
- Required (Toggle): Must fill.
Nazwisko (lista) #
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.
Zapisz się do aukcji #
Skorzystaj z pola opt-in w swoim formularzu i spraw, aby Twój użytkownik jako subskrybowany użytkownik mailchimp skontaktował się poprzez kliknięcie pola wyboru „Zapisz się do naszego newslettera”.
Check out our Demo na żywo tutaj
| Opcje | Opis |
|---|---|
| Pokaż etykietę | Włącz/wyłącz etykietę. |
| Pozycja | Domyślny: Szczyt Wybierz położenie etykiety. gdzie chcesz to zobaczyć. u góry lub na lewo od wejścia. |
| Etykieta wejściowa | Wpisz tekst etykiety. |
| Wyświetlanie opcji | Wyświetl opcję wyrażenia zgody na aukcję Poziomo Lub Pionowo |
| Opcje Pozycja tekstu | Wyświetl opcję wyrażenia zgody na aukcję Pozycja tekstowa: Zanim Pole wyboru lub Po Pole wyboru |
| Tekst opcji pola wyboru | Krótko opisz opcje, które zostaną wyświetlone użytkownikowi. Na przykład: "Zapisz się do naszego newslettera“ |
| Tekst pomocy | Wpisz tekst, który będzie wyświetlany pod widżetem. Z łatwością kieruj wiadomości do właściwych osób i dostarczaj je za pomocą tekstu pomocy |
| Wymagany | Domyślny: NIE Przełącz tę opcję, aby była wymagana. Użytkownicy nie mogą przesłać formularzy bez wypełnienia wymaganych pól. |
| Logika warunkowa | Pokaż/ukryj to pole w oparciu o określone kryteria. |
Zgoda RODO #
Włącz możliwość składania skarg w ramach RODO (ogólnego rozporządzenia o ochronie danych) w swoim formularzu przed zebraniem danych użytkownika, ponieważ wyjaśnia to, w jaki sposób zwykle wykorzystujesz dane użytkownika, aby zachować bezpieczeństwo przed działaniami prawnymi.
Treść #
- 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.
Sprawdzać out our Demo na żywo tutaj
Z linkiem tekstowym #
Sprawdzać out our Demo na żywo tutaj
Przełącznik #
Z łatwością kontroluj pole wyboru Tak/Nie lub Włącz/Wyłącz przełącznik, podobnie jak włącznik światła.
Treść #
- 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 na żywo tutaj
Tekst opcji niestandardowej #
Check out our Demo na żywo tutaj
reCAPTCHA #
Umożliwiają integrację Google reCAPTCHA, aby chronić Twoją witrynę przed niechcianym spamem i nadużyciami.
Check out our Demo na żywo tutaj
| Opcje | Opis |
|---|---|
| konfiguracja reCAPTCHA | Włącz reCAPTCHA w ustawieniach. Następnie musisz skonfigurować witrynę reCAPTCHA i tajny klucz z MetForm -> Ustawienia stąd. Zobacz Dokumentację. |
Proste reCAPTCHA #
Chroni Twoją witrynę przed niechcianymi botami i spamem.
Check out our Demo na żywo tutaj
Opcje wbudowane #
Check out our Demo na żywo tutaj
| Opcje | Opis |
|---|---|
| Pokaż etykietę | Włącz/wyłącz etykietę. |
| Pozycja | Domyślny: Szczyt Wybierz położenie etykiety. gdzie chcesz to zobaczyć. u góry lub na lewo od wejścia. |
| Wprowadź wyświetlacz CAPTCHA | Wpisz reCAPTCHA w bloku lub pokaż pole wejściowe w linii. |
| Etykieta | Wpisz tekst etykiety. |
| Tekst pomocy | Wpisz tekst, który będzie wyświetlany pod widżetem. |
Suwak zakresu #
Ustaw maksymalną lub minimalną wartość zakresu w swoim formularzu, używając super fajnego suwaka Zakres. Wszystko, co musisz zrobić, to po prostu przeciągnąć oba końce, aż pojawi się odpowiednia wartość.
Check out our Demo na żywo tutaj
Domyślna wartość #
Sprawdzać out our Demo na żywo tutaj
Wejście wielozakresowe #
Sprawdzać out our Demo na żywo tutaj
| Opcje | Opis |
|---|---|
| Pokaż etykietę | Włącz/wyłącz etykietę. |
| Pozycja | Domyślny: Szczyt Wybierz położenie etykiety. gdzie chcesz to zobaczyć. u góry lub na lewo od wejścia. |
| Etykieta | Wpisz tekst etykiety. |
| Nazwa | Imię i nazwisko jest wymagane. Wpisz nazwę bez spacji i znaków specjalnych. w przypadku wielu słów używaj tylko podkreślenia/łącznika (_/-). Nazwa musi być inna. |
| Tekst pomocy | Wpisz tekst, który będzie wyświetlany pod widżetem. |
| Wymagany | Domyślny: NIE Przełącz tę opcję, aby była wymagana. Użytkownicy nie mogą przesłać formularzy bez wypełnienia wymaganych pól. |
| Minimalna długość | Ustaw wartość zakresu minimalnego |
| Maksymalna długość | Ustaw wartość maksymalnego zakresu |
| Domyślna wartość | Ustaw wartość domyślną. Użyj przecinka, aby ustawić wartość zakresu |
| Kroki | Dodaj wartość kroków, aby dodawać zakres krok po kroku |
| Wprowadź jako zakres | Przełącz tę opcję, aby ustawić wymagany lub nie zakres |
| Logika warunkowa | Pokaż/ukryj to pole w oparciu o określone kryteria. |
Adres URL #
Po prostu dodaj adres URL do formularza, korzystając z naszego pola wprowadzania adresu URL. Zapewnia, że użytkownicy wprowadzą prawidłowy adres URL w polu formularza.
Treść #
- Show Label, Position, Label, Name: Standard label controls.
- Placeholder (Text): Sample URL hint.
- Tekst pomocy: Extra instructions.
- Required (Toggle): Must enter a valid URL.
Validation #
URL Validation: Ensures submission is a valid link.
Check out our Demo na żywo tutaj
Hasło #
Jeśli chcesz, aby użytkownik podał silne hasło, skorzystaj z naszego pola wprowadzania hasła. Zapewnia, że użytkownicy otrzymają chronione hasło i będą mogli je zmienić w razie potrzeby.
Treść #
- Show Label, Position, Label, Name: Standard label controls.
- Symbol zastępczy: Password hint text.
- Tekst pomocy: Instruction text below field.
- Required (Toggle): Must enter password.
Validation #
Validation Type (Dropdown): Enforce strength via characters/words/regex.
Check out our Demo na żywo tutaj
Wiadomość odpowiedzi #
Treść #
- Add Success Message (Textarea): Text shown after successful submission.
Check out our Demo na żywo tutaj:
Ocena #
Zbieraj oceny od klientów z Ocena pole wejściowe, przeszukaj pole wejściowe według jego nazwy, a następnie przeciągnij i upuść pole wejściowe w żądaną lokalizację. Pomaga uzyskać opinię klientów i zbudować dobrą więź między właścicielem a klientem.
Treść #
- Number of Rating Stars (Number Input): Custom number of stars to display.
- Show Label (Toggle), Position (Dropdown), Label, Name: Standard.
- Tekst pomocy: Rating instruction beneath stars.
- Required (Toggle): Must choose a rating.
Check out our Demo na żywo tutaj:
Dowolna liczba gwiazdek #
Check out our Demo na żywo tutaj
Udostępnianie pliku #
Metform sprawia, że dodawanie jest bardzo łatwe Udostępnianie pliku widget do swoich formularzy, wyszukaj pole wejściowe według jego nazwy, a następnie przeciągnij i upuść pole wejściowe w żądaną lokalizację.
Treść #
- Multiple Upload (Toggle): Allow uploading more than one file.
- Show Label (Toggle), Position (Dropdown), Label, Name: Label settings.
- Tekst pomocy: 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 na żywo tutaj
Streszczenie #
Podaj podsumowanie przed subskrypcją, aby zbudować dobrą komunikację z klientem.
Treść #
- Required (Toggle): Must review before submit.
- Show Label (Toggle), Position (Dropdown), Label, Name: Standard.
- Tekst pomocy: Explanation under summary.
Logika warunkowa #
- 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.
Przycisk Prześlij #
Prześlij formularz z tym polem i przechowuj dane na zapleczu.
Treść #
- 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.
Ustawienia #
Hidden (Toggle): Hidden input not visible but stored for backend.
Logika warunkowa #
- 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.
