Principiantes: cómo crear un formulario en múltiples pasos en WordPress (con un complemento)

¿Desea crear múltiples páginas sin trastorno en WordPress, que se ve muy bien y se convierte bien? La división de un formulario en varias páginas ayuda a aumentar el grado de participación y mejorar la experiencia del usuario, todos luchando al mismo tiempo con la fatiga de la forma, para obtener más conversiones de formularios. En este artículo, le mostraremos cómo crear un formulario en múltiples pasos en WordPress. Aquí hay un contenido de pasos si desea seguir adelante:
[Video] Cómo crear un formulario en múltiples pasos en WordPress
Crear un formulario en WordPress
Divida su forma en diferentes partes
Personalizar la barra de progreso
Configurar la configuración del formulario
Configurar las notificaciones de formulario
Personalizar las confirmaciones del formulario
Agregue su formulario a su sitio web
¿Por qué utilizar un formulario en múltiples pasos en su sitio web? En primer lugar, ¿te preguntas qué es una forma de múltiples pasos? Simplemente rompa su formulario en varias páginas o pasos, por lo que no es una forma larga.
Y, a pesar de agregar múltiples pasos a su forma de WordPress, el uso de una forma de varios pasos (también conocida como varias o más páginas) en su sitio de WordPress en realidad puede aumentar la tasa de conversión de la forma de su sitio, especialmente si el formulario tiene más de 3 campos de forma.
WPFORMS es el mejor complemento de WordPress Form Builder. ¡Tómelo gratis!
De hecho, después de dividir lo que alguna vez fue un formulario de página de paso de un solo paso en varios pasos, WhatIsmyComfortzone.com vio que el 53% de los visitantes del sitio se convirtieron y se convirtieron en potencial de clientes, incluso cuando el formulario se dividió en varios pasos. , Como hicieron las mismas preguntas en cada forma, tenía sentido que, desde entonces, todas las formas largas se transformarán en varios pasos en el sitio en su web. Aquí hay algunas razones adicionales para considerar crear un formulario en múltiples pasos en WordPress:

Fomentar la concentración: al agrupar las preguntas en el formulario, puede dividir la información en el enfoque del usuario.
Reduzca el abandono del formulario: es más probable que los usuarios completen la información que se le solicite cuando se divide en páginas, en lugar de presentarse como una forma larga.
Recopile solo lo que necesita: puede tener un formulario de WordPress en varios pasos con campos condicionales utilizando un condicional lógico. Muestre diferentes páginas del formulario en función de las cuales las respuestas proporcionadas por los usuarios.
Así que echemos un vistazo a cómo crear un formulario en múltiples pasos en WordPress.
Cómo crear un formulario en múltiples pasos en WordPress Si está buscando un formulario elemental en varios pasos, lea este tutorial y verifique cómo agregar un formulario elemental a WPFFORMS. ¿Vea el video de arriba si se pregunta cómo crear un formulario con múltiples pasos con un complemento? Si prefiere las instrucciones escritas, continúe leyendo a continuación. Y si está buscando el mejor complemento gratuito para el formulario de contacto, asegúrese de verificar nuestra publicación comparando WPForms Lite con el Formulario de contacto 7. Paso 1: Crea un formulario en WordPress Lo primero que tendrá que hacer es instalar y active el complemento WPFFORMS. Para obtener más detalles sobre cómo configurar este constructor de formulación, consulte esta guía paso a paso sobre cómo instalar un complemento en WordPrips. Luego vaya a WPFORMS »Agregar nuevo para crear un nuevo formulario. Puede dividir cualquier forma en varias partes o pasos utilizando WPFORMS. Entonces, para nuestro ejemplo, crearemos un formulario de contacto simple. En la pantalla de configuración, nombre el formulario y seleccione la plantilla que desea usar, dependiendo del tipo de formulario que cree. Elegiremos la plantilla del formulario de contacto simple.
WPFORMS creará un formulario de contacto simple en el generador de arrastrar y soltar.
Desde esta área del constructor de formularios, puede agregar campos adicionales a su formulario de contacto sacándolos del panel izquierdo al panel derecho.

Con la plantilla de formulario de contacto simple, ya tendrá los campos del nombre, el correo electrónico y el comentario o el mensaje. Haga clic en cualquiera de los formales para hacer cambios. También puede hacer clic en un campo de formulario y extraerlo para reorganizar el pedido de su formulario de contacto. Si desea crear algo más complejo que un formulario de contacto simple, eche un vistazo a algunos de los otros tutoriales que tenemos utilizando plantillas predefinidas que vienen con WPFFORMS: solicite un formulario de oferta

Solicitud de empleo
Formulario de pedido
Formulario de encuesta
Formulario de encuesta
Formulario de registro de usuario
Estos formularios tienden a ser mucho más largos que un formulario de contacto simple y probablemente requerirán más pasos para completar si solicita mucho.
Ahora echemos un vistazo a cómo dividir su forma en varias partes. Paso 2: Divida el formulario en diferentes partes después de haber agregado y personalizado todos los campos de formulario en su formulario, debe agregar el formulario de ruptura de la página a su sitio para dividirlo en diferentes páginas. Para hacer esto, dibuje el campo del formulario de ruptura de la página, en campos elegantes, desde el panel izquierdo hasta el panel derecho. Coloque el campo donde desee dividir el formulario.
Haga esto donde quiera que su formulario se divida en otra página. A partir de ahí, puede agregar campos de formulario adicionales para completar el formulario.
WPFORMS le permite crear cuántas páginas del formulario desea, pero no olvide no abrumar a sus usuarios. Solo recopile la información que necesita. Siempre puedes recopilar más información más tarde. Paso 3: Personalizar la barra de progreso del formulario de múltiples páginas en función de sus necesidades, le recomendamos que muestre un indicador de progreso para informar a los usuarios sobre las diferentes secciones de su forma. Siempre saben dónde están en forma y cuánto es queda por completar antes de hacer clic en “enviar” sobre la base del progreso. Para facilitarle las cosas. WPFFORMS viene con tres barras diferentes de migas de pan para sus formularios. En varios pasos:
Conectores: muestra una barra de conexión y títulos de páginas para cada lado de su formulario en varios pasos.

Círculos: muestra un círculo y un título de página en la página en su formulario en varios pasos.
Barra de progreso: indica el progreso del formulario a medida que el usuario lo completa.
Para personalizar la barra de progreso y el título de la página en la primera página de su formulario en varios pasos, haga clic en la sección PAUSE PAGE.
Aparecerá un nuevo panel en el editor de formulación, donde puede elegir la barra de progreso que desea usar. Puede cambiar el color del indicador de progreso aquí. También puede cambiar el título de la página para que los usuarios sepan en qué parte del formulario es si elige las opciones o conectores. De lo contrario, los usuarios solo verán una barra de progreso estándar que los guía por la cantidad de pasos que quedan en el formulario de múltiples pasos.
Para personalizar el título de la página siguiente y el botón que lleva a los visitantes del sitio a la página siguiente de su formulario, haga clic en la sección PAUSE PAUSE que creó cuando agregó el descanso de la página a su formulario, puede encender la función que le permite a Muestre los visitantes del sitio un botón de página anterior. De esta manera, puedo volver a la página anterior de su formulario si lo necesitan.
Cuando haga esto, tendrá la oportunidad de cambiar el botón de copia. Una vez que haya terminado de crear todos los descansos de página y personalizar el indicador de progreso, haga clic en Guardar. Paso 4: Configure la configuración del formulario para iniciar, acceder a la configuración »Generalidades.

Aquí puede configurar lo siguiente:

Nombre del formulario: cambie el nombre de su formulario aquí, si lo desea.


Descripción del formulario – Dale una descripción del formulario.

Envíe el texto al botón: personalice la copia del botón de envío.

Prevención de spam: detenga el formulario de contacto con spam con la función anti -spam, hcaptcha o google recaptcha. El cuadro de selección contra el spam se activa automáticamente en todas las nuevas formas.

Formularios AJAX: habilite la configuración de AJAX sin recarga de página para que pueda tener un formulario AJAX de múltiples pasos.
Mejoras GDPR: puede desactivar el almacenamiento de información de entrada y detalles del usuario, como direcciones IP y agentes de usuarios, en un esfuerzo por cumplir con los requisitos de GDPR. Consulte nuestras instrucciones de paso por paso sobre cómo agregar un campo de GDPR a su formulario de contacto simple.
Cuando haya terminado, haga clic en Guardar. Paso 5: Configure las notificaciones de notificaciones de formulario son una excelente manera de enviar un correo electrónico cada vez que se envía un formulario a su sitio web. De hecho, si no gira esta función, cada vez que alguien envía un formulario en múltiples pasos en su sitio, lo hará. recibir una notificación sobre la presentación. Si usa etiquetas inteligentes, también puede enviar una notificación al correo electrónico del usuario al enviar un formulario, comunicarse que lo ha recibido y que se pondrá en contacto en breve. Esto asegura a los visitantes del sitio que su forma ha pasado correctamente. También se agradece cuando se trata de formularios de páginas múltiples, que podrían haber llevado mucho tiempo. Lo último que un visitante para el sitio quiere preguntar es si ha pasado la forma larga. Para obtener ayuda con este paso, consulte nuestra documentación sobre cómo configurar las notificaciones de formulario en WordPress. Además, si desea mantener la marca constantemente en sus correos electrónicos, consulte esta guía para agregar un encabezado personalizado a su plantilla de correo electrónico.
Paso 6: Personalice la confirmación de confirmaciones del formulario del formulario son mensajes que se muestran a los visitantes del sitio una vez que envían un formulario en su sitio web. Comunica a las personas que su forma ha sido procesada y le brinda la oportunidad de informarles cuáles son los próximos pasos. Nuevamente, esto es especialmente útil cuando se trata de formularios largos en su sitio web. WPFORMS tiene tres tipos de confirmación para elegir:
Mensaje. Este es el tipo de confirmación predeterminado en WPFORMS. Cuando un visitante del sitio envía un formulario, aparecerá una confirmación simple del mensaje, lo que les informará que el formulario ha sido procesado. Busque algunos mensajes exitosos aquí para aumentar la felicidad de los clientes. Este tipo de confirmación llevará a los visitantes al sitio a una determinada página web de su sitio agradeciendo por enviar el formulario. Para obtener ayuda en este sentido, consulte nuestro tutorial sobre la redirección de clientes a una página de agradecimiento. Además, asegúrese de consultar nuestro artículo sobre la creación de páginas efectivas de Acción de Gracias para mejorar la lealtad de los clientes.
Vaya a URL (redirección). Esta opción se usa cuando desea enviar visitantes al sitio en otro sitio web.
Veamos cómo configurar una confirmación simple del formulario en WPFORMS, para que pueda personalizar el mensaje que los visitantes del sitio verán al enviar un formulario en su sitio. Haga clic en la pestaña Confirmación en el editor. De formularios en Configuración. Luego seleccione el tipo de tipo de confirmación que desea crear. Para este ejemplo, seleccionaremos el mensaje.
Luego personalice el mensaje de confirmación de acuerdo con su deseo y haga clic en Guardar. Para obtener ayuda con otros tipos de confirmación, consulte la documentación sobre la confirmación del formulario. Ahora está listo para agregar su formulario de contacto a su sitio web. Paso 7: Agregue su formulario a su sitio web después de haber creado su formulario en varios pasos, debe agregarlo a su sitio de WordPress. WPFFORMS le permite agregar sus formularios en varios lugares en su sitio web, incluidas páginas, publicaciones de blog y widgets en la barra lateral. Echemos un vistazo a la opción de colocación más común: incorporar la página / publicaciones. Para comenzar, cree una nueva página o publique en WordPress o acceda a la configuración de actualización en una existente. Después de eso, haga clic dentro del primer bloque (el área vacía en el título de su página) y haga clic en Add ADD. WPFORMS WPFFORMS aparecerá dentro de su bloque. Haga clic en el menú WPFFORMS Drop -up y elija uno de los formularios: ya ha creado que Desea insertar en su página Seleccione el formulario que acaba de crear.

Luego, publique su publicación o página para que su formulario de contacto aparezca en su sitio web. Luego haga clic en el botón azul en el lado superior derecho, que escribe publicado o actualizado para que su formulario aparezca en su sitio web.