Resumen de IA
¿Te gustaría crear un formulario de comentarios sencillo que se envíe automáticamente cuando los usuarios hagan una selección? Esto es perfecto para encuestas rápidas de "¿Te ha resultado útil?" donde los usuarios pueden responder con un solo clic. Al enviar automáticamente después de la selección, puedes maximizar las tasas de respuesta haciendo que el proceso sea muy fácil para los usuarios.
Esta guía te mostrará cómo crear un formulario de comentarios optimizado que se envía al instante cuando los usuarios eligen su opción.
Configuración de tu formulario
Primero, crea un nuevo formulario con esta estructura:
- Un campo de Diseño para organizar tus opciones
- Dos campos de Casilla de verificación: uno en cada columna del Diseño para las opciones "Sí" y "No"
- Un campo Oculto para capturar el título de la página
Si necesitas ayuda para crear tu formulario, revisa esta guía de creación de formularios.
Configuración de las Opciones de Icono
Para un aspecto pulido, utilizaremos opciones de icono para las opciones de Sí/No. Configura tus campos de casilla de verificación con estos ajustes:
Casilla de verificación Sí
- Habilita Usar opciones de icono
- Icono: face-smile
- Color del icono: #066aab
- Tamaño del icono: Grande
- Estilo de opción de icono: Clásico
- Ocultar etiqueta: habilitado
Casilla de verificación No:
- Mismos ajustes pero con el icono face-frown
Añadir una Etiqueta Inteligente al Campo Oculto
Para el Campo Oculto, vamos a añadir la Etiqueta Inteligente para capturar el título de la página cuando se envíe el formulario. Para saber más sobre las Etiqueta Inteligentes integradas con el constructor de formularios WPForms, puedes revisar esta documentación.
Hemos añadido la Etiqueta Inteligente {page_title} al Valor Predeterminado del Campo Oculto.
Enviar el formulario automáticamente
Ahora es el momento de añadir el fragmento a tu sitio. Si necesitas ayuda sobre cómo añadir fragmentos a tu sitio, consulta este tutorial.
Este fragmento solo se ejecutará en el ID de formulario 3046; cuando se marque cualquiera de los campos de Casilla de verificación, se activará esta función y se enviará el formulario automáticamente.
Necesitarás actualizar este ID de formulario para que coincida con tu propio ID de formulario. Si necesitas ayuda para encontrar tu ID de formulario, revisa esta guía.
Estilizar el Formulario
Añade este CSS para estilizar tu formulario adecuadamente. Actualiza el ID del formulario (3046) y los IDs de los campos (3 y 4) para que coincidan con tu formulario:
Este CSS oculta elementos innecesarios y posiciona tus iconos perfectamente. Para obtener ayuda sobre cómo añadir CSS, revisa nuestra guía sobre cómo añadir código CSS a tu sitio de WordPress.
Necesitarás actualizar el ID del formulario para estas reglas CSS para asegurarte de que se dirige al formulario y a los IDs de campo correctos.
Nuestro ID de formulario para el propósito de esta documentación es 3046. Nuestra primera casilla de verificación es el ID de campo 3 y la segunda casilla de verificación es el ID de campo 4.
Ahora, independientemente de la opción que seleccionen tus visitantes, el formulario se enviará automáticamente.
¡Y eso es todo! Ahora, cuando tus visitantes hagan clic en cualquiera de las opciones de icono, el formulario se enviará automáticamente. ¿Te gustaría mostrar u ocultar tu botón de envío condicionalmente según una respuesta de tu formulario? Por favor, consulta el tutorial sobre Cómo mostrar condicionalmente el botón de envío.