¿Le gustaría permitir a sus usuarios seleccionar múltiples opciones en un campo Dropdown? Añadir un desplegable de selección múltiple a tus formularios WordPress permite a tus usuarios seleccionar muchas opciones sin tener que utilizar un campo Casillas de verificación.
Este tutorial le mostrará cómo configurar un campo desplegable de selección múltiple en WPForms.
Primeros pasos
Antes de empezar, tendrás que crear un nuevo formulario o editar uno ya existente.
Para nuestro ejemplo, crearemos un formulario de consulta de un club deportivo. Para ello, abriremos el creador de formularios.
A continuación, vaya a la sección Campos estándar para encontrar el campo Desplegable. Simplemente haz clic en el campo para añadirlo al formulario, o arrástralo y suéltalo en el área de vista previa de tu formulario.
Una vez añadido el campo, haga clic en él para abrir su panel Opciones de campo.
A continuación, cambiaremos la etiqueta de este campo para que diga Seleccione los clubes sobre los que desea obtener más información. También añadiremos 4 opciones en Opciones: Natación, Tiro con arco, Cricket y Baile.
Desde las Opciones de campo, vaya a la sección Avanzadas y haga clic en ella para abrir opciones adicionales.
A continuación, seleccione la opción Selección de varias opciones para activarla.
Opciones de personalización
Hay dos configuraciones de estilo diferentes disponibles para el campo desplegable: Clásico o Moderno. Cada una de ellas formateará el desplegable de una manera ligeramente diferente. Puedes cambiar el estilo de tu campo desplegable en Avanzado " Estilo.
Estilo clásico
El estilo Clásico mostrará todas las opciones dentro de una caja. Cuando se añadan más de 4 opciones al desplegable, el cuadro incluirá una barra de desplazamiento vertical.
Nota: El estilo Clásico siempre mostrará al menos cuatro filas, aunque no haya datos en ellas.
Para seleccionar varias opciones, mantenga pulsado el botón Control (o Comando en Mac) mientras hace clic. Esto añadirá un efecto de resaltado a las opciones que hayas seleccionado.
Estilo moderno
El estilo Moderno mostrará un menú desplegable estándar. Este menú desplegable le permite desplazarse por una lista de opciones y seleccionar las que desee, o bien introducir términos de búsqueda para encontrar las opciones que desee.
Si se seleccionan varias opciones, cada una de ellas se añadirá a la barra desplegable.
Configuración de la lógica condicional
Configurar la lógica condicional con un desplegable de selección múltiple le permitirá mostrar u ocultar campos si un usuario selecciona más de una opción del desplegable.
Por ejemplo, en nuestro formulario de consulta sobre clubes deportivos, mostraremos a los usuarios un mensaje si seleccionan Natación y Baile en el menú desplegable. En nuestro mensaje, les haremos saber que estos clubes se reúnen en horarios contradictorios.
Para configurar esto, primero añadiremos un campo HTML a nuestro formulario.
Luego, en la sección Código, podemos añadir nuestro mensaje: "¡Atención! Los clubes que has elegido se reúnen en horarios conflictivos".
Después, tendremos que configurar nuestra lógica condicional para que el campo sólo aparezca cuando los usuarios seleccionen Natación y Baile. Para ello, haremos clic en la sección Lógica inteligente para abrirla y, a continuación, seleccionaremos la opción Activar lógica condicional.
Entonces, estableceremos la lógica para que diga Mostrar este campo si Seleccionar qué club(es) le gustaría conocer mejor es Natación Y Seleccionar qué club(es) le gustaría conocer mejor es Baile.
Este campo permanecerá ahora oculto a menos que un usuario seleccione tanto Natación como Baile en nuestro campo desplegable.
Nota: Para más detalles sobre cómo utilizar el operador AND, consulte nuestra guía sobre Lógica condicional inteligente.
¡Ya esta! Ahora puede configurar un campo desplegable de selección múltiple en sus WPForms.
A continuación, ¿le gustaría añadir fácilmente un gran número de opciones para un campo desplegable, de opción múltiple o de casilla de verificación? Consulte nuestro tutorial sobre cómo añadir opciones de forma masiva para obtener más detalles.