Crear formulario avanzado en Listable con Gravity forms

Suscríbete a mi canal:  

En este tutorial vamos a seguir enriqueciendo la plantilla Listable.

En el tutorial anterior vimos como añadir un botón para pedir presupuesto en cada una de la ficha.

En este tutorial vamos a crear el formulario que se van han encontrar los usuarios al hacer click en el botón de pedir presupuesto.

Para seguir este tutorial necesitas el plugin Gravity Forms. Gravity Forms lo puedes comprar por 39$/año o descargarlo de forma gratuita de la zona premium si eres miembro. Te puedes dar de alta por 10€/mes aquí y te puedes dar de baja en cualquier momento

Una característica que necesitamos de nuestro formulario es saber desde que ficha nos hacen la consulta. Gravity forms nos permite rellenar automáticamente esta información como veremos a continuación.

Una vez que ya tenemos instalado Gravity Forms nos aparecerá en el lateral de la zona de administración de WordPress «Formularios» –> Nuevo Formulario.

Hacemos clic, creamos un nuevo formulario y tendremos una pantalla como la siguiente:

nuevo formulario gravity forms

pantalla inicial gravity forms

En la derecha nos aparecen los campos que podemos añadir.

En nuestro caso vamos a añadir un campo en el que aparecerá el nombre del establecimiento desde que se hace click para llegar al formulario. Y lo haremos de forma automática.

Dentro de «Campos Estandar» hacemos click en el tipo de campo «Línea de Texto», se nos abrirá la información del campo. En la pestaña General rellenamos el campo «Etiqueta de campo» con el nombre que queramos. En mi caso «Empresa».
Hacemos click en la pestaña «Avanzado», seleccionamos la opción «Permitir al campo rellenarse dinámicamente» y en «Nombre parámetro» añadimos el nombre de variable que queramos, en mi caso «nombre_clinica».

tab avanzado campo gravity forms

Añadimos el resto de campos que necesitemos, como Nombre, Email, etc…

También podemos hacer que el campo Email se rellene automáticamente para los usuarios logueados.
Para conseguirlo creamos un campo avanzado del tipo «Email» y en la pestaña Avanzado en la opción «Valor predeterminado» en el desplegable añadimos la opción {user:user_email}

email rellenar automaticamente gravity forms

Una vez que tenemos el formulario a nuestro gusto creamos una página y lo añadimos en ella.
Creamos una nueva página, hacemos click en «Añadir formulario», seleccionamos el que hemos creado y aparecerá el código del formulario debajo:

pagina con formulario gravity forms

Y el resultado sería el siguiente:

Crear formulario avanzado en Listable con Gravity forms 1

Podemos ver que el campo del email se ha rellenado automáticamente pero el Campo Empresa todavía no.
¿Por qué? porque tengo que añadir la variable en el enlace del botón de cada ficha.

Si el enlace de tu formulario es /formulario-contacto lo que tienes que hacer es añadir al final de la url la variable de la empresa en concreto, es decir /formulario-contacto/?nombre_clinica=loquesea

El resultado sería:

Crear formulario avanzado en Listable con Gravity forms 2

Es decir que nuestro botón de pedir presupuesto:

boton pedir presupuesto

Tenemos que poner la url del contacto seguido de la variable con el nombre con el que queremos que se rellene:

url formulario gravity forms

Y si habéis llegado hasta aquí ya tenéis un formulario un poco más inteligente 😉

Un saludo
Óscar

2 comentarios en «Crear formulario avanzado en Listable con Gravity forms»

  1. Buenos días,

    Estoy creando una tienda de cursos, y necesito insertar un boton debajo del de añadir al carrito
    para que los clientes pidan informacion, aparte que cada vez que me pidan informacion tenga
    un numero de identificacion, Muchas gracias

    Saludos

Responder a Oscar martin Cancelar la respuesta