Resumen de IA
¿Te gustaría personalizar lo que los usuarios ven después de enviar un formulario en tu sitio? En WPForms, puedes ajustar fácilmente la configuración de confirmaciones para mostrar un mensaje de éxito, llevar a los usuarios a otra página de tu sitio o incluso redirigirlos a un dominio diferente.
Este tutorial te mostrará cómo configurar cada tipo de confirmación de formulario disponible en WPForms.
Primero, asegúrate de que WPForms esté instalado y activado en tu sitio y verifica tu licencia. Luego, deberás crear un formulario nuevo o editar uno existente.
Después de abrir el constructor de formularios y personalizar los campos de tu formulario, ve a Ajustes » Confirmaciones.
Aquí, seleccionarás entre tres opciones de Tipo de confirmación: mostrar un mensaje, mostrar una página y redirigir a una URL. Hemos explicado cada una en detalle a continuación.
Mostrar un mensaje de confirmación
En WPForms, Mensaje es el tipo de confirmación predeterminado. Cuando un usuario envía un formulario, este mensaje se mostrará en lugar del formulario incrustado.
Puedes personalizar este mensaje como desees. Aquí tienes algunas ideas a considerar:
- Haz tu mensaje más personal: Hemos reunido algunas sugerencias sobre cómo asegurarte de que tu mensaje de confirmación sea amigable y útil para los visitantes.
- Ofrece incentivos: Si deseas animar a los usuarios a enviar tus formularios, considera ofrecer un lead magnet descargable. Puedes añadir un enlace de descarga en tu mensaje de confirmación.
- Configura confirmaciones condicionales: Si deseas mostrar diferentes mensajes de confirmación según las entradas y selecciones de los usuarios, puedes aplicar lógica condicional a tus confirmaciones.
Opciones adicionales de mensaje de confirmación
El editor de mensajes de confirmación te permite personalizar tu mensaje y añadir fácilmente estilos de texto básicos si lo deseas.
También puedes optar por incluir Smart Tags en tu mensaje de confirmación. Esto extraerá datos de otras partes de tu sitio o de la entrada del usuario y los mostrará en tu mensaje.
Haz clic en Mostrar Smart Tags debajo del editor de mensajes para ver las opciones disponibles que puedes incluir en tu mensaje de confirmación.
Nota: Para obtener más información sobre cómo extraer datos de tu sitio o de las entradas del usuario en tus mensajes de confirmación, consulta nuestra guía completa sobre el uso de Smart Tags en WPForms.
También puedes elegir si habilitar o no la animación de desplazamiento predeterminada activando o desactivando la opción etiquetada como Desplazar automáticamente al mensaje de confirmación.
Cuando esta configuración está habilitada, un efecto de desplazamiento llevará la vista del usuario a la parte superior del mensaje de confirmación cuando envíen tu formulario.
Finalmente, puedes activar la opción para mostrar una vista previa de la entrada. Esto mostrará la entrada y las selecciones del usuario después del mensaje de confirmación.
Nota: Para obtener todos los detalles sobre cómo mostrar vistas previas de entradas, consulta nuestro tutorial completo sobre cómo mostrar vistas previas de entradas en WPForms.
Cuando la opción de vista previa de entrada está activada, podrás elegir entre cuatro estilos de vista previa. En el frontend, la vista previa de entrada se verá algo así.
Mostrar una página
Con el tipo de confirmación Mostrar página, puedes redirigir a los usuarios a otra página de tu sitio después de que envíen tu formulario.
Cuando selecciones Mostrar página en el menú Tipo de confirmación, aparecerá un menú desplegable adicional con una lista de todas las páginas publicadas en tu sitio. Simplemente selecciona a la que deseas enviar a los usuarios cuando envíen tu formulario.
Además de las páginas publicadas de tu sitio, este menú desplegable también incluye la opción Volver a la página anterior (Referrer). Seleccionar esta opción devolverá a los usuarios a la página en la que se encontraban antes de enviar el formulario.
Debajo de la selección de página, también verás un campo etiquetado como Parámetros de URL. Esto te permite añadir parámetros de cadena de consulta personalizados a la URL redirigida.
Por ejemplo, añadir ?status=success podría permitir que tu sitio muestre un aviso de "Formulario enviado con éxito" si tu tema o plugin está configurado para comprobar ese parámetro. También puedes usar parámetros para activar otras acciones, como mostrar un mensaje de "Cuenta actualizada con éxito" después de redirigir con la función de actualización de usuario del complemento de Registro de Usuarios.
Nota: Debes crear y publicar la página que deseas utilizar para las confirmaciones antes de poder configurar este tipo de confirmación. Para obtener ayuda sobre cómo crear una nueva página en WordPress, consulta el artículo sobre páginas del Codex de WordPress.
Esta opción se utiliza a menudo para redirigir a los usuarios a una página de agradecimiento. Para obtener consejos y ejemplos, consulta nuestro artículo sobre cómo crear una página de agradecimiento eficaz.
Ir a una URL (Redirigir)
El tipo de confirmación Ir a URL (Redirigir) es útil si deseas enviar a los usuarios a un sitio diferente o si necesitas crear una estructura de URL especializada para un desarrollo más complejo.
Cuando selecciones esta opción en la configuración de confirmaciones de tu formulario, aparecerá un campo para que introduzcas la URL a la que deseas enviar a los usuarios después de completar tu formulario.
Nota: Para personalizaciones avanzadas, como mostrar mensajes personalizados utilizando datos del formulario en tu página de redirección, consulta nuestra documentación para desarrolladores sobre este tema.
Preguntas frecuentes
A continuación, hemos respondido a algunas preguntas frecuentes sobre la configuración de los mensajes de confirmación del formulario.
¿Puedo personalizar el color de fondo de los mensajes de confirmación?
Sí. Una vez que tengas el selector CSS para el mensaje de confirmación, puedes cambiar los colores para que coincidan con el que te guste. A continuación, se muestra el selector CSS para el mensaje de confirmación:
.wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
background: #e0ffc7;
border: 1px solid #b4d39b;
box-sizing: border-box;
}
Nota: Si eres nuevo en el uso de CSS, asegúrate de consultar nuestra guía de introducción a CSS.
Deberás copiar el código y agregarlo a tu sitio. Una vez que hayas agregado el código, actualiza la propiedad background al color que desees usar. Si también deseas actualizar el color del texto, usa la propiedad color para establecerlo.
Nota: Si los estilos CSS personalizados no se muestran, agrega !important después de cada propiedad para anular los estilos predeterminados.
Puedes usar el plugin WPCode para agregar fácilmente código CSS personalizado a tu sitio web. Para ver los pasos sobre cómo usar este plugin, consulta nuestro tutorial sobre cómo agregar fragmentos de código personalizados a WordPress.
¿Puedo usar shortcodes en los mensajes de confirmación de WPForms?
Sí, puedes usar shortcodes en tus mensajes de confirmación de WPForms. Para obtener información sobre cómo implementar esto, consulta nuestra documentación para desarrolladores, que proporciona instrucciones paso a paso sobre cómo incorporar shortcodes en los mensajes de confirmación.
¡Eso es todo! Ahora puedes configurar confirmaciones para cada uno de tus formularios.
¿A continuación, te gustaría personalizar las notificaciones de tu formulario? Consulta nuestro tutorial sobre cómo configurar notificaciones por correo electrónico de formularios.