Contenido #

• 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.

Ajustes #

• 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.
  • Por longitud de carácter: Enforce minimum/maximum characters.
  • Por longitud de palabra: Enforce min/max number of words.
  • Basado en la expresión: Custom regex pattern for validation.
• Required Message (Text Input): Custom message when required rule fails.

Lógica condicional #

• 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 Demostración en vivo aquí.

Correo electrónico #

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.

Contenido #

• 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.

Ajustes #

• 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 Demostración en vivo aquí

Número #

Estos campos de entrada garantizarán que los usuarios ingresen un número válido con entrada numérica.

Contenido #

• 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.

Ajustes #

• Required? (Toggle): Mandatory numeric input.
• Validation Type:
  • None: Disables all validation.
  • By range: Restricts input to a specific numerical or date-based scale.
    • Min/Max: You set the lowest and highest acceptable values (e.g., age must be between 18 and 99).
    • Mensaje de advertencia: A custom alert that appears if the user enters a number outside that range.
  • By expression-based: You can enter a specific pattern in the Expresión field, such as [a-z, A-Z]+ to ensure the input contains only alphabetic characters, and set a custom Mensaje de advertencia.
• Get Value From URL: When enabled, automatically populates a field by capturing specific data passed through the URL’s query parameters.

Check out our Demostración en vivo aquí

Teléfono #

Permitir a los usuarios dar su número de teléfono válido para realizar conexiones.

Content & Settings #

El Teléfono widget includes all the same content and settings as the Número widget, allowing you to set ranges, expressions, and dynamic values.

Check out our Demostración en vivo aquí

Tiempo #

Ayuda a los usuarios a seleccionar su hora preferida en el temporizador emergente.

Content & Settings #

El Tiempo widget shares the exact same content and settings customization as the Número y Teléfono widget.

A unique addition here is the Use 24H Format toggle, which allows you to switch between a standard AM/PM display and a 24-hour military time format.

Check out our Demostración en vivo aquí

24H Format: Check out our Demostración en vivo aquí

Fecha #

Utilice este campo de entrada para seleccionar Fecha del calendario emergente en su formulario para hacerlo más fácil de usar.

Contenido #

El Fecha widget includes the same core content customization options as the Número widget.

Ajustes #

• Required?: Makes the date selection mandatory for form submission.
• Set current/min/max date: Restricts the calendar to a specific timeframe (e.g., no past dates or a fixed deadline).
• Disable date list: Blocks specific dates, like holidays or weekends, from being selectable.
• Range Date Input: Changes the field to a “Check-in to Check-out” style double date picker.
• Year/Month/Date input: Customizes the labels or placeholders for each part of the date.
• Date Format & Localization: Sets the display style (e.g., DD/MM/YYYY) and adapts the calendar to local languages.
• Want to input time with it?: Adds a time-picker to the calendar for precise scheduling.
• Get Value From URL?: Auto-fills the date using a value passed through the website link.

Check out our Demostración en vivo aquí

Entrada de rango de fechas

Check out our Demostración en vivo aquí

Seleccionar fecha con entrada de hora

Check out our Demostración en vivo aquí

Seleccionar #

Agregue una lista desplegable de opciones para que los usuarios elijan, busque el widget por su nombre y luego arrastre y suelte el widget en la ubicación deseada.

Content & Settings #

The options here are the same as the Number widget.

En el content part, when you add an item to a La lista desplegable, you define how it appears and behaves using these four settings:

• Status Select it default? (Yes/No): If set to Sí, this item will be automatically pre-selected when the page loads.
• Input Field Text: This is the label the user sees in the menu (e.g., “United States”).
• Input Field Value: This is the “hidden” data sent to the server when the item is picked (e.g., “US”).
• Status (Enable/Disable): A toggle to show or hide the specific item without deleting it from your list.

Check out our Demostración en vivo aquí

Opción de búsqueda como etiqueta #

Check out our Demostración en vivo aquí

Selección múltiple #

Seleccione Varios elementos del menú desplegable a la vez.

(Same as Select, but allows selecting multiple options from the list.)

Multiple Selection (Toggle): Allow multiple items to be chosen.

Check out our Demostración en vivo aquí

Valores seleccionados predeterminados #

Check out our Demostración en vivo aquí

Área de texto #

Ayuda a agregar una gran cantidad de contenido, revisar y comentar a su formulario. 

(Much like Text, but supports multiple lines.)

Contenido #

• Rows (Number Input): Controls visible height of textarea.
• Show Label, Position, Label, Name, Help Text, Required: Same as text.

Check out our Demostración en vivo aquí

Caja #

Permita a los usuarios seleccionar varios elementos de su formulario a la vez con Checkbox.

Contenido #

• 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.

Mostrar #

Layout (Dropdown: Vertical / Inline): Arrange options layout.

Check out our Demostración en vivo aquí

Vertical #

Check out our Demostración en vivo aquí

Posición del icono después del texto #

Check out our Demostración en vivo aquí

Radio #

Permita a los usuarios seleccionar solo un artículo exclusivo entre las múltiples opciones.

Contenido #

• 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 Demostración en vivo aquí

Vertical #

Check out our Demostración en vivo aquí

Posición del icono después del texto #

Check out our Demostración en vivo aquí

Nombre (Listado) #

Allow users to give their First Name to show them in a listing method on the mailing list. For Example : Mailchimp

Contenido #

• Validation Type (Dropdown): Min/max or expression validation for names.
• Show Label (Toggle), Position (Dropdown), Label: As standard.
• Placeholder (Text Input): Name hint.
• Texto de ayuda: Additional instructions.
• Required (Toggle): Must fill.

Apellido (Listado) #

Permita que los usuarios proporcionen su apellido para mostrarlos en un método de listado en la lista de correo. Por ejemplo: Mailchimp

Same controls as First Name.

Optar por el listado #

Utilice el campo de suscripción en su formulario y convierta a su usuario en un usuario de contacto suscrito de Mailchimp haciendo clic en la casilla de verificación "Suscribirse a nuestro boletín".

Check out our Demostración en vivo aquí

Consentimiento RGPD #

Habilite las quejas del RGPD (Reglamento general de protección de datos) en su formulario antes de recopilar datos del usuario, ya que explica cómo utiliza habitualmente los datos del usuario para mantenerse a salvo de acciones legales.

Contenido #

• 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.

Controlar out our Demostración en vivo aquí

Con enlace de texto #

Controlar out our Demostración en vivo aquí

Cambiar #

Controle fácilmente la entrada de la casilla de verificación Sí/No o Encendido/Apagado como un interruptor de luz.

Contenido #

• 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 Demostración en vivo aquí

Texto de opción personalizada #

Check out our Demostración en vivo aquí

reCAPTCHA #

Le permite integrar Google reCAPTCHA para mantener su sitio a salvo del spam no deseado y el tráfico abusivo.

Check out our Demostración en vivo aquí

reCAPTCHA simple #

Protege su sitio de spam y bots no deseados.

Check out our Demostración en vivo aquí

Opciones en línea #

Check out our Demostración en vivo aquí

Control deslizante de rango #

Establezca su valor de rango máximo o mínimo en su formulario usando el control deslizante de Rango súper genial. Todo lo que tienes que hacer es arrastrar ambos extremos hasta que llegue el valor apropiado. 

Check out our Demostración en vivo aquí

Valor por defecto #

Controlar out our Demostración en vivo aquí

Entrada de rango múltiple #

Controlar out our Demostración en vivo aquí

URL #

Simplemente agregue una URL a su formulario usando nuestro campo de entrada de URL. Garantiza que los usuarios ingresen una URL válida en el campo del formulario. 

Contenido #

• Show Label, Position, Label, Name: Standard label controls.
• Placeholder (Text): Sample URL hint.
• Texto de ayuda: Extra instructions.
• Required (Toggle): Must enter a valid URL.

Validation #

URL Validation: Ensures submission is a valid link.

Check out our Demostración en vivo aquí

Contraseña #

 Si desea que su usuario proporcione una contraseña segura, utilice nuestro campo de entrada de contraseña. Garantiza que los usuarios obtengan una contraseña protegida y puedan cambiarla cuando sea necesario.

Contenido #

• Show Label, Position, Label, Name: Standard label controls.
• Marcador de posición: Password hint text.
• Texto de ayuda: Instruction text below field.
• Required (Toggle): Must enter password.

Validation #

Validation Type (Dropdown): Enforce strength via characters/words/regex.

Check out our Demostración en vivo aquí

Mensaje de respuesta #

Contenido #

• Add Success Message (Textarea): Text shown after successful submission.

Check out our Demostración en vivo aquí:

Clasificación #

Recopile calificaciones de clientes con Clasificación campo de entrada, busque el campo de entrada por su nombre y luego arrastre y suelte el campo de entrada en la ubicación deseada. Ayuda a obtener opiniones de los clientes y a establecer un buen vínculo entre el propietario y el cliente.

Contenido #

• Number of Rating Stars (Number Input): Custom number of stars to display.
• Show Label (Toggle), Position (Dropdown), Label, Name: Standard.
• Texto de ayuda: Rating instruction beneath stars.
• Required (Toggle): Must choose a rating.