Cómo construir un formulario lógico condicional de Elementor en 5 pasos
Publicado: 2022-03-29Agregar lógica condicional al formulario de Elementor puede aumentar las tasas de envío de formularios.
¿Cómo? Bueno, porque el formulario Elementor de lógica condicional puede asegurarse de que sus clientes no tengan que completar campos innecesarios. Como resultado, ofrece una mejor experiencia de usuario.
¿Sabes cuál es la mejor parte de la forma lógica condicional de Elementor?
Bueno, la mejor parte es que construir la forma lógica condicional de Elementor es una tarea realmente fácil. Especialmente si sigues este artículo. Porque en este blog aprenderá cómo construir la forma lógica condicional de Elementor en solo 5 pasos.
Además, aprenderá sobre las ventajas de usar la forma lógica condicional de Elementor y cuándo usarla.
Entonces, sigue leyendo….
¿Qué es la lógica condicional en formularios?
La lógica condicional en los formularios es una forma de controlar cómo actúa un formulario en función de la entrada del usuario. Puede hacer que campos de formulario específicos o campos múltiples se oculten y solo sean visibles después de que su usuario realice una determinada acción o elija un determinado valor en sus formularios.
Es una práctica común en los formularios de WordPress hoy en día. Pase a la siguiente sección para descubrir por qué la lógica condicional es popular y cuándo la gente suele usarla en sus formularios.
¿Por qué y cuándo usar la lógica condicional en Elementor Form?
Los formularios condicionales son realmente muy efectivos para asegurarse de que sus clientes tengan la mejor experiencia mientras completan sus formularios. Además, garantiza que obtenga la cantidad exacta de datos que necesita.
¿Se pregunta cómo?
Bueno, a los clientes no les gusta especialmente llenar formularios. Seamos realistas, ¡no es realmente el pasatiempo de nadie!
Además de eso, si les pide que den información que no es particularmente útil/relevante para ellos, entonces es obvio que sus usuarios se molestarán.
Y ahí es exactamente donde la lógica condicional en los formularios resulta útil. Porque con la lógica condicional, puede asegurarse de que sus formularios le pedirán a los usuarios que completen la información relevante y no todos los campos del formulario.
Básicamente, la forma condicional en Elementor sigue la lógica "Si condición". Por ejemplo, si la condición A es verdadera, la Acción X se llevará a cabo; de lo contrario, no se llevará a cabo. También puede configurar muchas condiciones para una sola acción. Por ejemplo, la Acción X solo tendrá lugar si la Condición A y la Condición B son verdaderas, o cualquiera de ellas es verdadera.
Hablemos de un ejemplo de la vida real, supongamos que desea saber cuántos niños traerá uno a un evento.
Ahora no necesita pedirles a todos que completen el número de niños. Puede preguntarles primero si planean traer niños, y una vez que digan que sí, puede mostrar la opción en el formulario para seleccionar cuántos niños traerán.
De esta forma, aquellas personas que no vayan a traer ningún niño no tendrán que rellenar los campos de número de niños. De hecho, tendrán un formulario más corto que los motivará a terminar de completar el formulario en lugar de abandonarlo a la mitad.
Para resumir, estas son las ventajas de usar la lógica condicional en forma de Elementor:
- Ahorra tiempo a los usuarios, ya que los usuarios solo deben completar los campos que están destinados a ellos.
- Mejora la experiencia del usuario ya que las formas condicionales son más convenientes.
- Alienta a los usuarios a completar el formulario, ya que son más cortos que los que no tienen lógica condicional.
- Obtiene toda la información relevante y una mayor tasa de envío de formularios.
Ahora que sabe lo útil que puede ser la lógica condicional, pasemos a la siguiente sección, donde aprenderá cómo agregar lógica condicional al formulario de Elementor.
Cómo construir un formulario de Elementor de lógica condicional: Guía paso a paso
Siga todos los pasos correctamente para crear su formulario Elementor de lógica condicional en unos momentos.
Paso 1: Instale los complementos necesarios
Para agregar lógica condicional a un formulario de Elementor, junto con la versión gratuita de Elementor, debe instalar MetForm, un generador de formularios de Elementor. Necesitarás ambos
- MetForm (Gratis)
- MetForm Pro
Puede consultar la documentación si necesita ayuda con el proceso de instalación y activación de MetForm.
Nota : no necesita la versión Pro de Elementor para seguir este proceso.
Paso 2: arrastre y suelte el widget de MetForm en su página de Elementor
Ahora vaya a la página donde desea agregar su formulario de lógica condicional de Elementor. Puede agregar el formulario condicional a una página existente o crear una nueva página. Sin embargo, asegúrese de estar en el modo Editar con Elementor .

Ahora busque MetForm, una vez que encuentre el widget, arrástrelo y suéltelo en la página.

Paso 3: Crea/Agrega un formulario a tu página
Ahora, puede elegir un formulario existente o crear uno nuevo. Para crear un nuevo formulario o agregar uno ya existente, haga clic en el botón Editar formulario.

Ya he creado un formulario de reserva de demostración, así que voy a
- Elija "Seleccionar formulario"
- Seleccione mi formulario existente llamado "Formulario de Elementor de lógica condicional" del menú desplegable
- luego haga clic en Editar formulario.

Si desea crear su formulario desde cero con MetForm , consulte nuestro blog en
cómo crear un formulario de contacto de varios pasos desde cero usando MetForm.
Paso 4: agregue lógica condicional a los campos de formulario de Elementor
Con la función condicional de MetForm, puede hacer que el campo del formulario se oculte/muestre en función de múltiples condiciones , como si el campo dependiente está vacío, no vacío, es igual (coincide con algún valor), no es igual, mayor que, mayor que igual, menor que , etc. Además, puede personalizar si todas las condiciones deben ser verdaderas o si alguna de ellas debe ser verdadera para que se lleve a cabo la acción.
En este artículo, voy a aplicar algunas de estas condiciones, puede seguir los mismos pasos para aplicar todas las condiciones. Para aplicar cualquier condición , es necesario seguir los siguientes pasos:
Edite el campo y habilite la lógica condicional
Para esto, en el campo de formulario, haga clic en el icono de edición en la esquina superior derecha , luego en el panel de configuración izquierdo y desplácese un poco hacia abajo, luego expanda la opción Lógica de condición y finalmente active el botón Habilitar.


Establecer los criterios y la acción
Ahora, elija el criterio de coincidencia de condición como Y/O y el tipo de acción como Mostrar este campo/ocultar este campo del menú desplegable.

Establecer la condición
Ahora es el momento de establecer la condición, establecer una condición
- Haga clic en el elemento + AÑADIR NUEVO
- En el campo Si , agregue el nombre del campo contra el cual desea agregar la condición
- En el menú desplegable Coincidencia (comparación) , elija la condición.
Por ejemplo, quiero que el campo Correo electrónico solo sea visible cuando el campo Nombre completo no esté vacío. Como resultado, cuando alguien complete su nombre solo, el campo Correo electrónico aparecerá visible. Para eso, voy a
- Copie el nombre del campo de texto de nombre completo
- Regrese a la sección de lógica condicional del campo de correo electrónico y péguelo en el campo "Si"
- Finalmente, elija no vacío en el menú desplegable Coincidencia (comparación).

Siga estos pasos exactos para agregar lógica condicional a todos los campos de formulario de su formulario condicional de Elementor o algunos, según sus requisitos.
Nota : si desea establecer condiciones para campos de formulario como Radio o Casilla de verificación donde tiene múltiples opciones, debe poner el nombre del campo en el campo Si y establecer el valor de las opciones de radio/casilla de verificación en el campo Valor de coincidencia.
Por ejemplo, para que el campo Otro estado aparezca solo cuando algunos elijan a otros como su estado material, debe
- Elija Match (comparación) como iguales
- Copie el nombre del campo Estado civil
- Péguelo en la opción "Si" de la lógica condicional de Otro Estado
- Copie el valor de la opción Otros del campo Relación de estado civil
- luego péguelo en la opción "Valor de coincidencia" de la lógica condicional de Otro estado

He seguido los mismos pasos para hacer visible el formulario Need Pet sitters solo cuando el número de mascotas es mayor que 1 .

Agregar formularios en una ventana emergente es un imán de plomo probado. Compruebe cómo puede agregar formularios en una ventana emergente modal en solo 3 pasos.
Paso 5: personalice la configuración del formulario relacionada con la confirmación, notificación para completar
Una vez que haya terminado de agregar toda la lógica condicional a su formulario de Elementor, haga clic en CONFIGURACIÓN DEL FORMULARIO para personalizar diferentes configuraciones. Puede
- Personalice el título, el mensaje de éxito, el inicio de sesión requerido, las vistas de recuento, etc. en la configuración general.
- Puede personalizar opciones como Activar la confirmación, establecer Asunto del correo electrónico, Correo electrónico de, Del correo electrónico y Mensaje de agradecimiento, etc. en Configuración de confirmación.
- En Configuración de notificaciones, obtendrá opciones de notificación por correo electrónico como Habilitar el correo de notificación para el administrador, Asunto del correo electrónico, Correo electrónico para, Correo electrónico de, Nota del administrador, etc.
También puede configurar las diferentes integraciones de Pago y CRM si lo desea. Para obtener más detalles sobre estos temas, consulta la documentación. Después de realizar todos los cambios, desplácese hacia abajo y haga clic en Guardar cambios.

Haga clic en ACTUALIZAR Y CERRAR para guardar el formulario condicional que acaba de crear.

Ahora, si hace clic en el botón de vista previa, debería ver su formulario condicional de Elementor como el que se muestra a continuación:

Cómo usar la plantilla preconstruida de MetForm para agregar un formulario condicional en Elementor
Ahora, si está buscando una plantilla prefabricada de forma lógica condicional de Elementor, entonces no puede encontrar una mejor opción que MetForm. Porque este generador de formularios de WordPress proporciona más de 6 plantillas de formulario de lógica condicional de Elementor prefabricadas.
Para usar los formularios condicionales predefinidos de MetForm, cuando llegue al tercer paso del proceso mencionado anteriormente , desplácese un poco hacia abajo para encontrar todos los formularios condicionales. Para elegir el formulario que prefiera, haga clic en el formulario y luego haga clic en Editar formulario.

Cuando se cargue el formulario, haga clic en ACTUALIZAR Y CERRAR, y finalmente guarde su página. Aquí hay una vista previa del formulario de lógica condicional de Elementor prefabricado por MetForm:

Artículos relacionados:
MetForm vs Contact Form 7 vs Gravity Forms: ¿Cuál es el mejor creador de formularios?
Cómo crear un formulario de solicitud de vacante atractivo
Ultimas palabras
¡Felicidades! Ahora ya sabe cómo agregar lógica condicional a los formularios de Elementor. Espero que ahora utilice este proceso para crear un formulario de lógica condicional de Elementor fácil de usar en su sitio web de WordPress.
Tenga en cuenta que su trabajo es asegurarse de que los usuarios deban hacer el mínimo esfuerzo para completar su formulario. Y eso es lo que las características condicionales de MetForm funcionan de manera asombrosa. Además, MetForm también admite shortcode.
No se olvide de las plantillas de formulario de lógica condicional preconstruidas de Elementor. Además, le recomiendo encarecidamente que consulte todas las increíbles funciones de MetForm. Las características avanzadas de este complemento de WordPress lo ayudarán a crear formularios de Elementor más optimizados.