Cómo crear un formulario con un campo repetidor en WPForms

Publicado: 2023-10-04

¿Se pregunta cómo incorporar un campo repetidor de WPForms en sus formularios en línea para capturar más datos para cada envío de formulario?

Los campos repetidos en los formularios permiten a los usuarios ingresar múltiples conjuntos de datos similares y, al mismo tiempo, hacen que los formularios sean más intuitivos y fáciles de usar.

En este artículo, le mostraremos la forma más sencilla de diseñar un campo repetidor para WPForms para mejorar la funcionalidad y la experiencia del usuario de su sitio web.

En este articulo

  • 1. Suscríbase e instale WPForms Pro
  • 2. Cree un nuevo formulario en blanco
  • 3. Agregue un campo desplegable con opciones Sí/No
  • 4. Aplique lógica condicional a los campos de su formulario
  • 5. Habilite la lógica condicional para los campos desplegables
  • 6. Habilite notificaciones y confirmaciones de formularios
  • 8. Publique su formulario con campos repetidos
  • Más preguntas sobre el campo repetidor de WPForms

¿Por qué utilizar un campo repetidor de WPForms?

La belleza del campo repetidor de WPForms radica en su capacidad para agilizar la recopilación de datos y al mismo tiempo ofrecer otros beneficios, como:

  • Diseño centrado en el usuario: al introducir campos repetidos, permite a los usuarios dictar el alcance de sus entradas. Es un guiño sutil a la autonomía del usuario y mejora la experiencia general del usuario.
  • Flexibilidad en el diseño de formularios: no todos los formularios son iguales para todos. Con los campos repetidos, puede atender varios escenarios, ya sea una entrada única o varias entradas, asegurando que su formulario se adapte a diversos requisitos.
  • Estructuración de datos consistente: uno de los desafíos con múltiples campos son los datos inconsistentes. Los datos permanecen estructurados y uniformes con campos repetidos, lo que simplifica el procesamiento y análisis de backend.
  • Longitud de formulario reducida: en lugar de tener un formulario largo e intimidante con numerosos campos, los campos repetidos brindan una apariencia más limpia, lo que garantiza que los usuarios no se sientan abrumados a primera vista.

Si usted es un emprendedor que busca una incorporación de clientes optimizada o un blogger interesado en la recopilación de datos eficiente, el campo repetidor de WPForms es invaluable. ¡Vayamos a los pasos para configurarlo!

Cómo crear un formulario con un campo repetidor en WPForms

Crear un formulario con un campo repetidor en WPForms es bastante fácil y requiere sólo una comprensión básica de la lógica condicional. Siga los pasos a continuación para comenzar:

1. Suscríbase e instale WPForms Pro

Cuando se trata de crear formularios únicos, WPForms es la mejor opción. Puede usarlo para crear y publicar cualquier tipo de formulario en WordPress. El complemento de formulario viene con más de 1000 plantillas de formulario, que se pueden usar para crear formularios de campos repetidos.

Dado que usaremos lógica condicional para configurar los campos repetidores en su formulario para esta guía, debe suscribirse a WPForms Pro, que también le brinda acceso a integraciones premium, complementos y un montón de funciones útiles.

WPForms homepage

Después de comprar una suscripción a WPForms Pro, debe instalar y activar el complemento en su sitio de WordPress.

¡Ahora vamos a crear tu formulario!

2. Cree un nuevo formulario en blanco

Vaya a WPForms desde su panel de administración de WordPress y elija Agregar nuevo de la lista de opciones.

Add new form WPForms

A continuación, asigne un nombre a su formulario y elija una plantilla de WPForms existente o simplemente configure un nuevo formulario según sus necesidades.

En este tutorial, crearemos un nuevo formulario para mostrarle todos los pasos esenciales para configurar el campo de repetición. Entonces, elegiremos la opción Crear formulario en blanco .

Create a blank form for repeater field

Ahora será dirigido a la pantalla Campos , donde aparecen los campos disponibles en el panel izquierdo. A aquellos a los que tenga acceso dependerán de su nivel de licencia.

WPForms fields menu

Verá una vista previa editable de su formulario en el panel derecho. Como seleccionamos un formulario en blanco, esta sección aparecerá vacía.

Add fields to your repeater form

Utilice el creador de formularios intuitivo de WPForms para agregar, modificar y organizar fácilmente campos personalizados para adaptar el formulario a su gusto.

Para este tutorial, agregaremos tipos de campos principales como Nombre , Correo electrónico y Teléfono para obtener la información de un solo usuario, es decir, Registrante 1.

Registration fields for repeater form

A continuación, lo guiaremos a través de los sencillos pasos para crear un componente repetidor a través de un campo desplegable y lógica condicional.

3. Agregue un campo desplegable con opciones Sí/No

Para agregar el campo desplegable a su formulario, puede hacer clic en él en el panel izquierdo o arrastrarlo y soltarlo directamente en la vista previa del formulario.

WPForms select dropdown field

Después de eso, asigne al campo desplegable Etiqueta un nombre como "¿Agregar otro?" y luego puede agregar opciones simples Sí/No para Opciones .

Configure dropdown options

A continuación, repetiremos los mismos pasos para agregar los campos Nombre , Correo electrónico y Número de teléfono debajo del campo desplegable para el Registrante 2.

Fields below dropdown repeater form

Después de eso, agregaremos otro campo desplegable con las mismas opciones Etiqueta y Sí/No en Opciones para crear el efecto repetidor.

Configure dropdown options

Esto le permite crear un efecto en el que cada conjunto posterior de campos de registrante utiliza lógica condicional solo para mostrarse si el usuario respondió a "¿Agregar otro?".

Dropdown field below repeater fields

Ahora, necesitamos aplicar la lógica condicional a los campos de su formulario para que solo cuando el usuario seleccione en su menú desplegable aparezcan campos de registrante adicionales.

4. Aplique lógica condicional a los campos de su formulario

Puede hacerlo fácilmente haciendo clic en cualquier campo desde la vista previa del formulario derecho y navegando a la pestaña Smart Logic en Opciones de campo .

Smart Logic tab in field options

En el menú Smart Logic , marque la opción Habilitar lógica condicional para todos los campos del formulario debajo de "¿Agregar otro?" Campo desplegable que creamos anteriormente.

Enable conditional logic for repeater field

A continuación, utilice la lógica condicional para mostrar el campo sólo si el campo desplegable , es decir, "¿Agregar otro?" es " ". Repita esto para todos los demás campos debajo de él.

Conditional logic show field if yes

5. Habilite la lógica condicional para los campos desplegables

Para evitar que la persona que completa el formulario agregue un tercer registrante a menos que haya ingresado la información del registrante 2, deberá configurar una lógica condicional para el campo desplegable debajo.

Para hacer esto, marque la opción Habilitar lógica condicional para el campo desplegable debajo de los campos Registrante 2: nombre, correo electrónico y teléfono.

Enable conditional logic for dropdown field

A continuación, utilice la lógica condicional para mostrar el campo solo si el campoRegistrante 2 – Correo electrónico no está vacío .Esto creará el efecto de campo repetidor.

Dropdown field is not empty

Puede repetir los pasos anteriores tantas veces como desee para obtener abundante información del registrante, que solo se mostrará si el usuario responde Sí a "¿Agregar otro?".

A continuación, haga clic en el botón Guardar en la esquina superior derecha del creador de formularios antes de continuar para asegurarse de que no se pierda ninguno de sus cambios.

Save the form

¡Casi estámos allí! Ahora, necesitamos habilitar las notificaciones y confirmaciones de formulario que aparecen después de realizar el envío de un formulario.

6. Habilite notificaciones y confirmaciones de formularios

Es fundamental configurar los mensajes y notificaciones que aparecerán después de que un usuario complete y envíe su formulario de registro.

Este proceso es simple. Seleccione Notificaciones en la pestaña Configuración en la pantalla del Creador de formularios.

Form notification settings

Las alertas se enviarán automáticamente a los administradores. Sin embargo, puede configurar el asunto, el cuerpo y la lista de destinatarios, si es necesario.

Enable form notifications for repeater field form

El mensaje que verán sus consumidores después de enviar el formulario se puede cambiar seleccionando Confirmaciones en la página Configuración .

Form confirmation

También puede utilizar la configuración Tipo de confirmación en WPForms para mostrar un mensaje, vincular a otra página o redirigir al usuario.

Customize confirmation message for repeater field form

¡Gran trabajo! Todo lo que queda por hacer ahora es publicar su formulario en una página nueva o existente para hacerlo público y listo para recopilar envíos.

8. Publique su formulario con campos repetidos

Cree una nueva página web o publicación, o modifique una existente. Después de eso, seleccione el ícono de WPForms haciendo clic en el botón Agregar bloque .

Add form widget WPForms

A continuación, elija el diseño de su formulario de campo repetidor en el menú desplegable en el bloque WPForms para agregarlo a su página o publicación.

Si desea personalizar la apariencia de su formulario, ahora puede ser un buen momento para diseñarlo usando el editor de bloques.

Repeater field form

Si todo parece ir en la dirección correcta, puede hacer público su formulario haciendo clic en el botón Actualizar o Publicar .

Cuando haya terminado de publicar el formulario, lo único que queda por hacer es probar el formulario incrustado para asegurarse de que funcione como se espera en la interfaz.

WPForms repeater field

Más preguntas sobre el campo repetidor de WPForms

La creación de formularios de campos repetidores es un tema de interés popular entre nuestros lectores. A continuación se ofrecen algunas respuestas rápidas a algunas de las preguntas más frecuentes:

¿Qué es un campo repetidor?

Un campo repetidor es una herramienta versátil que permite a los usuarios agregar dinámicamente múltiples conjuntos de campos idénticos en un formulario. Imagínelo como un botón de "copiar" para un grupo de campos. Mejora la flexibilidad al ingresar datos repetibles, como registros múltiples.

¿Cómo agrego un campo repetidor en WordPress?

Normalmente necesitarás un complemento de WordPress confiable para incorporar un campo repetidor. WPForms, un creador de formularios de WordPress de primer nivel, puede ser una opción ideal si desea agregar un campo repetidor a sus formularios, sin ningún conocimiento de CSS o codificación.

¿Qué es un campo repetidor en WordPress?

Dentro del ecosistema de WordPress, un campo repetidor le permite crear un conjunto de subcampos que el usuario puede duplicar mientras completa el formulario. Esto es especialmente útil cuando la cantidad de conjuntos de datos repetibles no está predefinida.

A continuación, aprenda cómo crear un formulario de acordeón en WordPress

¿Está buscando una forma sencilla de agregar un diseño de forma de acordeón a su sitio web de WordPress? Consulte nuestra publicación sobre el método más simple para crear un formulario de acordeón usando WPForms para mejorar la usabilidad y la experiencia del usuario de su sitio web.

Crea tu formulario de WordPress ahora

¿Listo para construir tu formulario? Comience hoy con el complemento de creación de formularios de WordPress más sencillo. WPForms Pro incluye muchas plantillas gratuitas y ofrece una garantía de devolución de dinero de 14 días.

Si este artículo le ayudó, síganos en Facebook y Twitter para obtener más tutoriales y guías gratuitas de WordPress.