No todos los visitantes de su sitio web tienen el mismo propósito. Lo más probable es que proporcione una variedad de artículos o servicios a los clientes y clientes, en lugar de simplemente uno. Es por eso que tener varios formularios de contacto específicos puede ayudar a suavizar la UX de su sitio para que sus clientes (y futuros clientes) puedan comunicarse con usted con la menor fricción posible con respecto a exactamente lo que necesitan. Lo guiaremos a través de la construcción de la canalización óptima entre usted y sus usuarios utilizando el módulo de formulario de contacto Divi y nuestra funcionalidad de lógica condicional.
Un adelanto del formulario de contacto condicional
Cuando todo esté dicho y hecho, tendrá algo similar a esto en su sitio web, listo para que lo utilicen sus visitantes.
¿Qué es exactamente la lógica condicional?
Para empezar, nos gustaría definir la lógica condicional de manera sucinta. En esta lección, configuraremos una sucesión de formularios de contacto que parecen depender de las elecciones que el usuario hace o no hace.
Por ejemplo, podría tener un formulario de contacto único que cambie según el servicio o producto que necesite el visitante. De esa manera, en lugar de que ellos tengan que escribirlo, puede tener la información que necesita en el formato que necesita. La lógica condicional del formulario de contacto ayuda a mejorar la comunicación y agiliza su capacidad de dar a sus usuarios.
Create Amazing Websites
Con el mejor generador de páginas gratuito Elementor
Empezar ahoraCon eso en mente, comencemos a desarrollar los formularios de contacto específicos.
Cómo utilizar la lógica condicional para crear formularios de contacto
Abra Divi Builder.
Tendremos que ingresar al Divi Builder porque estamos usando el módulo Formulario de contacto Divi. En este tutorial, usaremos el paquete de diseño de Mantenimiento del paisaje como ejemplo. Puede usar cualquier disposición o diseño que desee, pero debe poder usar y diseñar el módulo de formulario de contacto de Divi.
Para comenzar, navegue hasta Divi Builder en el backend de su sitio web de WordPress. Dentro del Editor de página, verá un botón morado con la etiqueta "Usar Divi Builder" (o Editar con Divi Builder si ya ha creado la página).
Inserte o ubique el módulo de formulario de contacto.
Luego, identifique un módulo de formulario de contacto existente en la página o haga clic en el icono del círculo Black \ 002B y seleccione Formulario de contacto en el menú desplegable.
Complete la configuración del formulario de contacto
De forma predeterminada, el módulo Formulario de contacto de Divi incluye tres campos: Nombre, Correo electrónico y Mensaje. Crearemos un formulario de contacto para que esas opciones no aparezcan hasta que el visitante nos haya proporcionado suficiente información para dirigir su consulta.
Agregar la primera pregunta condicional
Complete los espacios en blanco con la primera pregunta condicional. El botón " Agregar nuevo campo " se puede encontrar en la pestaña Contenido , debajo de los campos existentes en el formulario. Simplemente haga clic en eso.
Esto abre el cuadro Configuración de campo , donde debería ver campos para ID de campo y Título . El ID de campo está destinado a usted. Eso es lo que aparece en la configuración del módulo para que lo supervise. El título es el texto que sus visitantes verán en la parte frontal del formulario. (El título también se mostrará en el correo electrónico que reciba después de enviar el formulario).
El ID de campo está etiquetado como "Condicional" ya que esta es la primera pregunta que el visitante verá en el formulario. Lo que vean a continuación estará determinado por su reacción. Esta es una forma sencilla de realizar un seguimiento del flujo de las preguntas y respuestas del formulario.
Agregar opciones de campo
Desplácese hacia abajo hasta la sección Opciones de campo debajo de la pestaña Contenido. Aquí es donde pondrá las opciones para que el usuario elija. Cada uno de ellos servirá como una indicación para preguntas adicionales. Las casillas de verificación se utilizan como tipo de entrada en este ejemplo. Esto significa que el consumidor tiene la opción de seleccionar tantos como desee.
Además de las casillas de verificación, Divi admite las siguientes características adicionales: campo de entrada y área de texto para las respuestas escritas por el usuario, botones de selección desplegable y de radio para las opciones individuales que proporcione y campo de correo electrónico para la entrada de direcciones de correo electrónico. El campo de nombre predeterminado es un campo de entrada, mientras que el campo de mensaje predeterminado es un área de texto.
Con las casillas de verificación marcadas, ingresaremos las opciones que deseamos activar posteriormente. Luego, para evitar que el usuario envíe el formulario antes de tiempo, queremos que este sea un campo obligatorio .
Vale la pena señalar que no usamos lógica condicional en esta etapa. Debido a que este es el desencadenante, el usuario lo verá independientemente.
Crear nuevos campos de respuesta condicional
Sin embargo, para los nuevos Campos que agregamos como respuestas de seguimiento, agregaremos Lógica condicional a continuación. Debido a que incluimos tres opciones para la primera pregunta, agregaremos tres nuevos campos equivalentes al formulario. Deberá repetir los pasos a continuación para cada uno.
Nombra las respuestas condicionales en los nuevos campos.
Hemos utilizado la práctica de nombrar condicional 1 (para denotar el primer desencadenante condicional) seguido de 1a, 1b y 1c para las respuestas de seguimiento. También los hemos etiquetado adecuadamente para que sepamos cuáles son.
De manera similar a la primera pregunta, ingresaremos el Título como la pregunta que verá el visitante.
Adición de lógica condicional a los campos de respuesta.
Después de eso, vaya a la sección Lógica condicional de la pestaña Contenido de ese campo. Active la palanca de Lógica condicional . Luego, para este, seleccione Relación, lo que significa que puede establecerlo en cualquiera (cualquier número de respuestas puede hacer que se muestre esta opción) o en todos (solo la combinación específica de respuestas hace que aparezca este campo).
Si solo usa una regla de activación única, como nosotros, cualquiera o todas funcionarán.
Notarás el campo que lo activa en Reglas y, a la derecha, puedes elegir qué opción lo activará. El calificador, como igual, no es igual, es menor que, es mayor que, etc., se ubica en el centro. Para este campo, elegimos la pregunta Condicional 1 y luego la opción dentro de ella que hace que aparezca explícitamente este campo.
Repita ese paso para todas las respuestas condicionales.
Debido a que presentamos tres posibles respuestas a nuestra pregunta condicional única, haremos lo mismo para los otros campos. Solo se crean las respuestas correlativas adecuadas para esa selección.
Configure el 'Nombre / Correo electrónico / Mensaje' de los campos del formulario de contacto para que aparezcan
Una vez que haya configurado las respuestas para la lógica condicional, queremos que el visitante pueda enviar el formulario. Para lograr esto, modificaremos la lógica condicional en los campos Nombre , Correo electrónico y Mensaje . Debido a que la preparación para cada uno de estos es la misma, lo repetirá tres veces.
Vaya a Lógica condicional en la configuración de los campos Nombre, Correo electrónico y Mensaje. Habilítelo e ingrese tantas respuestas finales a sus preguntas de seguimiento condicionales como tenga. En este ejemplo, tenemos tres consultas de seguimiento, por lo tanto, aplicamos tres reglas.
Seleccione la pregunta de seguimiento como desencadenante de cada regla. Establezca el calificador en no vacío, lo que significa que la condición se cumple siempre que el visitante responda a la pregunta. El cuadro final aparecerá en gris, lo que sugiere que cualquier respuesta es adecuada.
Guarde sus cambios y luego repita para cualquier otro campo que desee que aparezca para permitir el envío de formularios. ¡Eso es todo al respecto! Su formulario se adaptará automáticamente a las necesidades de sus consumidores.
Los resultados finales
Puede ver cómo funciona la lógica condicional en la práctica en el siguiente video.
Pensamientos finales
Una de las partes más comunes de un sitio web es el formulario de contacto. Casi todos los sitios web tienen uno y casi todos los sitios web lo necesitan. Sin embargo, no todas las personas visitan su sitio web por la misma razón. Puede transformar sus formularios de contacto en una herramienta dinámica para que sus usuarios se comuniquen utilizando la función lógica condicional de Divi.
