Añade Google Address Autocomplete a tus landing pages en LanderLab para mostrar sugerencias de direcciones en tiempo real mientras los visitantes escriben, y conseguir que los campos de dirección se rellenen más rápido y con más precisión.
Qué es Google Address Autocomplete
Google Address Autocomplete usa la API de Google Places para mostrar sugerencias de direcciones en tiempo real en cuanto un visitante empieza a escribir en un campo de dirección. En lugar de escribir toda su dirección a mano, el visitante puede elegir entre una lista de sugerencias coincidentes, lo que agiliza el formulario y reduce los errores al escribir. Para usar esta función en LanderLab, tienes que hacer dos cosas:- Añadir el bloque Google Address Autocomplete Input a tu quiz o formulario en el editor
- Conectar tu API Key de Google Places desde el panel de integraciones
Cuando añades una integración de Google Address Autocomplete, se guarda de forma global en tu cuenta. Puedes reutilizarla en varias landing pages sin volver a introducir los datos.
Parte 1: añade el bloque de autocompletado
Primero, añade el campo de dirección especializado al paso del quiz o formulario en el que quieres recoger la dirección.1
Abre el editor del quiz
Abre la landing page que contiene tu embudo de quiz y entra en el editor del quiz.
2
Ve al paso de la dirección
Ve al paso en el que quieres recoger la dirección del visitante.
3
Añade el bloque
Haz clic en Add Block, busca Google Address Autocomplete Input y arrástralo a tu paso del quiz.
Parte 2: conecta tu API Key de Google Places
Cuando hayas añadido el bloque, conecta tu API Key de Google Places desde el panel de integraciones.1
Ve a tu landing page
Ve a Landing Pages y haz clic en el nombre de la landing page en la que quieres activar el autocompletado de direcciones.
2
Abre la pestaña de integraciones
Haz clic en Add Integration para abrir el panel de integraciones.
3
Selecciona Google Address Autocomplete
En la lista de integraciones disponibles, busca Google Address Autocomplete y haz clic en él. Aparecerá un formulario de configuración.
4
Rellena los campos obligatorios
Introduce estos datos:
5
Guarda y publica
Haz clic en Add Google Address Autocomplete para guardar la integración y después usa Publish o Republish en tu landing page. A partir de ese momento aparecerán sugerencias de direcciones en tiempo real cuando los visitantes escriban en el campo de dirección.
Conéctalo a otra landing page
Como las integraciones de Google Address Autocomplete se guardan de forma global, no tienes que crear una nueva para cada landing page.1
Abre otra landing page
Ve a Landing Pages y haz clic en el nombre de la landing page en la que quieres usar la misma integración.
2
Añade la integración
Haz clic en Add Integration. Verás las configuraciones de Google Address Autocomplete que guardaste antes. Selecciona la que quieres conectar.
3
Selecciona las variantes (si procede)
Si tu landing page tiene varias variantes de un test A/B, aparecerá una ventana para que elijas qué variantes deben usar esta integración. Selecciona las variantes que quieras y confirma.
4
Guarda y publica
Haz clic en Save y después usa Publish o Republish en tu landing page para activar el autocompletado de direcciones en las variantes seleccionadas.
Cómo conseguir una API Key de Google Places
Si todavía no tienes una API Key de Google Places, sigue estos pasos para crearla en la consola de Google Cloud.1
Abre la consola de Google Cloud
Ve a console.cloud.google.com e inicia sesión con tu cuenta de Google.
2
Crea o selecciona un proyecto
Haz clic en Select a Project en la parte superior de la página y elige un proyecto existente o haz clic en New Project para crear uno.
3
Activa la API de Places
- Ve a APIs and Services en la barra lateral izquierda.
- Haz clic en Library.
- Busca Places API.
- Haz clic en ella y después en Enable.
4
Crea una API Key
- Ve a APIs and Services > Credentials.
- Haz clic en + Create Credentials y selecciona API Key.
- Copia la clave de API generada y pégala en el campo API Key de LanderLab.
5
Restringe tu API Key (recomendado)
Para evitar el uso no autorizado de tu clave, aplica restricciones en los ajustes de la clave de API:
- En API restrictions, selecciona Places API para que la clave solo se pueda usar para el autocompletado de direcciones.
- En Application restrictions, selecciona HTTP referrers (websites) y añade el dominio de tu landing page.
Consejos para Google Address Autocomplete
- Los dos pasos son necesarios: si añades el bloque sin conectar la API Key (o al revés), tendrás un campo de texto normal sin sugerencias. Asegúrate de completar la parte 1 y la parte 2.
- Publica después de conectar: las sugerencias de autocompletado no aparecerán en tu página en vivo hasta que vuelvas a publicarla después de añadir la integración.
- Restringe tu clave de API: cualquiera que encuentre una clave sin restricciones puede usarla. Aplica siempre restricciones de API y de dominio en la consola de Google Cloud para proteger tu uso y tu facturación.
- La facturación es obligatoria, pero normalmente gratis: tienes que activar la facturación en tu proyecto de Google Cloud, pero los 200 $ de crédito gratuito mensual que ofrece Google bastan para casi todos los usos en landing pages, salvo que tengas volúmenes de tráfico muy altos.