Si utilizas Gravity Forms para tus formularios ya sabrás de su flexibilidad y su potencia: igual sirve para hacer un formulario de contacto, para realizar una encuesta, para crear un examen o para implementar una página de ventas, con pago incluido.
En este artículo-vídeo vamos a ver una de las funcionalidades que incluye por defecto (no es necesario ningún add-on adicional para ello) que es la de crear un formulario con paginación o por pasos con Gravity Forms.
Tabla de contenidos
Por qué crear un formulario por pasos
Y ¿cuál es la finalidad de esto? ¿Qué utilidad tiene un formulario por pasos? Porque, en fin, una de las máximas del marketing (aplicable a casi cualquier aspecto de la vida) dice que cuanto más sencillo y simple, mejor. Entonces, ¿por qué complicar algo añadiéndole etapas?
Bueno, el problema viene cuando el asunto en cuestión ya es de por sí complicado. En este caso el dividirlo en pasos puede ayudar a, de algún modo, «ocultar» a primera vista esa complicación.
Para dejarme de abstracciones y ser más claro que el agua, lo mejor es ver en qué dos casos concretos (los más habituales, puede haber más) es útil dividir un formulario en pasos:
- Cuando el formulario es muy largo, es decir, consta de muchos campos. En este caso, el ver de golpe todos los campos que tiene que rellenar puede hacer que al usuario «le dé pereza» ponerse a ello, y puede afectar la tasa de conversión del formulario.
- Que necesitemos pedir (demasiados) datos personales. Los usuarios son somos reticentes a dar datos personales por internet, y ver que tenemos que dar, por ejemplo, el teléfono, puede hacer que decidamos no rellenar un formulario. Sin embargo, si los datos personales los ponemos al final de un formulario de tres pasos, el usuario:
- De inicio no verá que se los vamos a pedir.
- Quizá deje de lado esas reticencias por no perder el trabajo ya hecho.
Como ves, en estos casos (como decía antes, puede haber otros) crear un formulario por pasos puede ayudar bastante en la conversión.
Aunque debes tener en cuenta una cosa: el usuario debería poder conocer de antemano, mediante una barra de progreso o una indicación del número de pasos totales, la longitud del formulario (no te preocupes, en el vídeo que acompaña esta entrada podrás ver cómo se hace).
Esto es así porque, de no hacerlo, podríamos conseguir el efecto contrario: al no saber el usuario si el formulario será demasiado largo, quizá ni comience a hacerlo. Sin embargo, si ve que sólo consta de dos o tres pasos, pensará que no es tanto.
¿Estás construyendo tu tienda online o eres implementador WordPress?
¿Necesitas plugins de calidad y con soporte para implementar funcionalidades concretas?
Consigue todos los plugins a la venta en la sección de plugins de esta web y todos los que siga añadiendo. Acceso a los 96 plugins (y subiendo) con soporte directo del desarrollador, actualizaciones y uso ilimitado: úsalos en tantas webs como lo necesites.
Crear un formulario con paginación con Gravity Forms
Pero ya está bien de teoría, así que vamos a empezar a ensuciarnos las manos.
La «magia» la crea uno de los campos estándar de Gravity Forms: el campo Página. Si elegimos ese campo en un nuevo formulario nos creará una estructura inicial para la paginación de dicho formulario, con tres cuadros:
- Comienzo de la paginación
- Salto de página
- Fin de la paginación
Lo que, para empezar, nos deja un formulario con dos pasos o páginas. No te preocupes, puedes añadir todas las que necesites, incluyendo páginas condicionales: páginas que sólo aparecerán si ciertos campos tienen una respuesta específica, o si todos son rellenados o si… en fin, prácticamente con las condiciones que necesites.
Vídeo: formulario por pasos con Gravity Forms
Pero como explicar todo esto a golpe de tecla sería tan largo y lioso para mí como lo sería para ti leerlo, lo mejor y más claro es que lo veas paso a paso en un vídeo, ¿verdad?
Como siempre, ya sabes que para cualquier duda, sobre la implementación de un formulario o funcionalidad con Gravity Forms o sobre cualquier otra cosa, tienes a tu disposición el formulario de contacto.
Fernando dice
Buenas! consulta, ¿cómo puedo añadir lo de «acepto la cláusula de privacidad»? Gracias!
Enrique dice
Hola Fernando
Bues basta con un campo de tipo Casillas, obligatorio y con una sola opción («Acepto…»).
Un saludo.
Mayte dice
Buenos días Enrique. Tengo una duda con este plugin. Antes de comprarlo me gustaría saber si podría personalizarlo con css para darle mi estilo.
Por ejemplo, poner dos columnas, una con campos y otra información.
Y cambiar colores, tipografías, estilos de botones… etc
Muchas gracias!
Un abrazo!
Enrique J. Ros dice
Hola Mayte
TODO puede personalizarse con CSS 🙂 Pero además en este caso es bastante sencillo, primero porque GF ya tiene clases CSS predefinidas para aplicar layouts, columnas, etcétera (echa un vistazo a esto), y segundo porque siempre puedes contar con la ayuda del add-on Gravity Forms Styles Pro 🙂
Un saludo
Mayte dice
Genial Enrique!! Muchas gracias!
Un abrazo!!
Oscar Perez dice
Hola
Como puedo configurar Gravity Forms de manera que aparezcan más preguntas hacia abajo conforme lo voy llenando, lo mismo que hace el salto de página pero permaneciendo en la misma página.
Un saludo.
Enrique J. Ros dice
Hola Óscar
Puedes usar para ello la lógica condicional (que cada pregunta aparezca sólo si la anterior contiene una respuesta).
Un saludo
Mayte dice
Hola de nuevo Enrique, ¿Cómo podría recoger el dato del campo nombre y mostrarlo en un texto en otra parte del formulario? Por ejemplo: «Hola Nombre»
Mil gracias!
Un abrazo!
Enrique J. Ros dice
Hola Mayte
Sí, claro que se puede, aquí explico cómo hacerlo. Sólo tienes que aplicarlo a la página de confirmación recogiendo en ella el dato recibido por GET, como hago yo (puedes ver el resultado aquí).
Un saludo
Mayte dice
Mil gracias de nuevo Enrique!!
Pero me gustaría que el nombre saliera en otra página del formulario por pasos. Dentro del mismo formulario pero en otro paso, no en la página de confirmación. ¿Esto es posible?
Gracias!!
Un abrazo!
Enrique J. Ros dice
Si se trata de mostrarlo dentro del mismo formulario, tendrías que crear un script específico para ello en JavaScript, no veo otra forma.
Un saludo
José Alfonso dice
Buenos días, Enrique. Tengo un problema, cuando el usuario pasa a la siguiente página del formulario, el navegador le deja al pie, no en la parte superior, con la consiguiente sensación de confusión. ¿Qué estoy haciendo mal? Especialmente en la pantalla del móvil, resulta muy engorroso tener que subir hasta la primera pregunta de la página… Gracias.
jorge dice
Hola
Quiero hacer una pagina de modelos y necesito que los usuarios registrados, puedan subir sus fotos, para que las puedan votar las personas que vean sus perfiles, públicos.
Como puedo hacerlo
Gracias
Mario R. Vásquez S. dice
Una pregunta .
El usuario puede dejar de contestar en un paso , salirse y luego regresar al mismo paso .