Resumen de IA
Después de que el archivo zip se haya descargado en tu ordenador, abre tu panel de administración de WordPress y haz clic en Plugins » Añadir nuevo. Luego, haz clic en el botón Subir plugin.
Permitir a los usuarios previsualizar sus entradas reduce enormemente las posibilidades de errores e imprecisiones mientras completan los formularios.
WPForms tiene un campo de vista previa de entrada que puedes añadir fácilmente a tus formularios, para que tus usuarios puedan ver un resumen rápido de sus entradas durante y después del envío.
En esta publicación, te mostraremos cómo añadir el campo de vista previa de entrada y personalizarlo de diferentes maneras en WPForms.
Crea un formulario con vista previa de entradas ahora
Cómo previsualizar una entrada de formulario antes de enviarla
Sigue nuestro tutorial paso a paso para aprender cómo añadir una vista previa de envío a tus formularios.
En este artículo
Empecemos.
1. Instalar WPForms
Para empezar, elige un plan de WPForms adecuado y registra tu cuenta. Luego, inicia sesión en tu área de cuenta de WPForms y haz clic en la pestaña Descargas. Esto abrirá una página donde podrás pulsar el botón Descargar WPForms para descargar el archivo zip.
Mientras estás en esta página, asegúrate de copiar tu clave de licencia. La necesitarás más tarde cuando actives WPForms Pro en tu sitio de WordPress.
Después de que el archivo zip se haya descargado en tu ordenador, abre tu panel de administración de WordPress y haz clic en Plugins » Añadir nuevo. Luego, haz clic en el botón Subir plugin.
Ahora, haz clic en el botón Elegir archivo y selecciona el archivo del plugin que acabas de descargar.
Haz clic en Instalar ahora cuando el archivo se haya subido.
WPForms se instalará ahora en tu sitio de WordPress. Esto solo debería tardar unos segundos. Cuando la instalación finalice, pulsa el botón Activar plugin.
Ahora haz clic en WPForms » Ajustes. Esto abrirá la pestaña de ajustes generales por defecto. Desplázate hacia abajo para encontrar el campo Clave de licencia e introduce tu clave aquí (que copiaste anteriormente).
Luego, haz clic en el botón Verificar clave. Esto completará la instalación de WPForms Pro en tu sitio.
2. Añadir un nuevo formulario
Ahora, abre el área de administración de WordPress de tu sitio y haz clic en WPForms » Añadir nuevo en la barra lateral izquierda. Ahora puedes darle un nombre a tu formulario para que te sea fácil encontrarlo más tarde.
Desplázate hacia abajo para seleccionar una plantilla para empezar a construir tu formulario. Al igual que todos los campos de WPForms, el campo de vista previa de entrada es compatible con la mayoría de las más de 2100 plantillas de formularios disponibles.
Cuando hayas seleccionado una plantilla, vamos a añadir el campo de vista previa de entrada en el siguiente paso.
3. Añadir el campo de vista previa de entrada del formulario
En el siguiente ejemplo, estamos utilizando un formulario de reserva de citas personalizado, pero eres libre de usar cualquier plantilla de formulario de tu elección.
Para añadir una función de vista previa a tu formulario, simplemente arrastra y suelta el campo Vista previa de entrada desde el panel izquierdo del constructor al panel derecho, donde están los campos reales de tu formulario.
Cuando añadas el campo de vista previa de entrada a tu formulario, añadirá automáticamente una nueva página donde aparecerá la vista previa.
Así es como aparece la vista previa en acción cuando un usuario está rellenando un formulario:
También puedes colocar el campo Vista previa de entrada varias veces dentro de tu formulario. Por ejemplo, si tienes un formulario de varias páginas, puedes colocar un campo Vista previa de entrada después de cada página. Esto significa que tus usuarios pueden previsualizar la información que han rellenado en páginas anteriores mientras continúan rellenando el resto de tu formulario.
Añadir múltiples campos de Vista previa de entrada a lo largo de tus formularios largos es una excelente manera de asegurarte de que tus usuarios puedan previsualizar sus entradas y retroceder en cualquier momento para hacer cambios si es necesario.
4. Personalizar el aviso y el estilo de la vista previa
WPForms te permite personalizar el aviso de vista previa. Simplemente haz clic en el campo Vista previa de entrada en la vista de tu constructor de formularios para abrir la configuración del campo.
Puedes usar el botón de alternancia Mostrar aviso de vista previa para mostrar el mensaje encima de la vista previa de la entrada o ocultarlo por completo.
Además, tienes la libertad de editar el aviso de vista previa a tu gusto o dejar el mensaje predeterminado tal como está.
A continuación, es posible que desees cambiar el estilo de la Vista previa de entrada. Haz clic en la pestaña Avanzado en las opciones del campo Vista previa de entrada para elegir entre 4 estilos de vista previa diferentes:
- Básico
- Compacta
- Tabla
- Tabla, Compacta
El estilo predeterminado es Básico, que muestra una vista previa línea por línea de la entrada del formulario.
Si deseas darle un aspecto más ajustado a tu vista previa, puedes optar por la opción de estilo Compacta.
Esto completa la configuración del campo Vista previa de entrada dentro de tus formularios. Pero hay otro tipo de vista previa de entrada que puedes añadir, como mostramos en el siguiente paso.
5. Añadir confirmación de vista previa de entrada
Además de las Vistas previas de entrada que aparecen cuando estás rellenando un formulario, WPForms también te permite mostrar vistas previas *después* de que un usuario haya enviado un formulario.
A diferencia del campo Vista previa de entrada, tus usuarios no obtienen la capacidad de cambiar sus entradas cuando se muestra una confirmación de vista previa. En su lugar, solo muestra a tus usuarios una copia de su envío que ya no se puede cambiar.
Para configurar las confirmaciones de vista previa de entrada, dirígete a Ajustes » Confirmaciones en el constructor de formularios de WPForms. Aquí, puedes activar el botón Mostrar vista previa de entrada después del mensaje de confirmación.
Cuando hayas habilitado esta opción, verás que aparece un menú desplegable que te permite elegir un estilo de vista previa, como mostramos anteriormente para los campos de Vista previa de entrada.
Aún puedes usar Vistas previas de entrada (que aparecen cuando se está rellenando un formulario) junto con la confirmación de vista previa (que solo aparece después de que se han enviado las entradas). O puedes usar solo una u otra de estas opciones. Todo depende de tus preferencias y de lo que estés intentando lograr con tus formularios.
¡Y eso es todo! Ahora puedes permitir que tus usuarios previsualicen una entrada del formulario antes de enviarla.
¿Por qué mostrar una vista previa de entrada?
La capacidad de previsualizar entradas es muy útil, especialmente cuando se trata de formularios más largos y complejos.
Es normal cometer errores tipográficos y equivocaciones al rellenar un formulario, pero una vista previa antes del envío te permite revisar la información para verificar su exactitud antes de pulsar el botón de enviar.
Por lo tanto, si desea minimizar los errores y dar a sus usuarios la capacidad de corregir cualquier error antes de enviarlo, debe incluir el campo Vista previa de entrada que ofrece WPForms.
A continuación, aplique restricciones de acceso a formularios de WordPress
¿Desea restringir sus formularios de WordPress solo a usuarios registrados? WPForms le permite seleccionar los niveles de permiso de usuario según su estado de inicio de sesión. Consulte nuestro artículo sobre cómo restringir formularios de WordPress a usuarios registrados para obtener más información.
También puede consultar nuestra guía sobre los mejores plugins de barra de notificaciones para WordPress para promocionar sus ventas y ofertas especiales en su sitio.
Crea un formulario con vista previa de entradas ahora
¿Listo para crear tu formulario? Empieza hoy mismo con el plugin constructor de formularios de WordPress más fácil. WPForms Pro incluye muchas plantillas gratuitas y ofrece una garantía de devolución de dinero de 14 días.
Si este artículo te ha sido útil, síguenos en Facebook y Twitter para obtener más tutoriales y guías gratuitas de WordPress.
La información es genial, sin embargo, no está totalmente claro cómo hacer una confirmación total del formulario. Situación: tenemos un formulario de varias páginas y queremos confirmar el formulario completo al final. No cada página por separado.
Hola Karina,
La vista previa de las entradas debería funcionar bien con varias páginas. Para varias páginas, recomendamos colocar la vista previa de la entrada en su propia página al final de su formulario para que los usuarios no la vean hasta después de haber completado el resto de los campos. De esta manera, podrá ver la vista previa completa del formulario en su lugar.
Por si le sirve de ayuda, aquí tiene nuestro excelente artículo sobre el mismo tema.
¡Espero que esto ayude!
¿Es posible mostrar también la descripción del campo en la vista previa? Por el momento podemos mostrarlas, gracias
Hola Claudio,
Actualmente, no tenemos una función nativa para mostrar la descripción del campo en la Vista previa de entrada antes del envío. He añadido su voto para considerar esto como una característica para el futuro.
¡Gracias!
Estoy usando los botones de radio de varios artículos de Stripe. ¿Hay alguna forma de evitar que la vista previa muestre la cantidad que se les cobrará dentro de esto?
por ejemplo, tengo la cantidad en el texto del botón de radio. Es confuso mostrarlo dos veces.
Hola Sharon: Actualmente no tenemos la función para deshabilitar/ocultar el precio en la vista previa del formulario. Estoy de acuerdo en que sería una función útil, y la añadiré a nuestro rastreador de solicitudes de funciones para que esté en el radar de sus desarrolladores.