La función de autocompletado de direcciones simplifica la experiencia de compra para tus clientes, reduciendo los errores al ingresar la información y disminuyendo la probabilidad de que abandonen el carrito, al agilizar el proceso.
Para poder utilizar esta aplicación extra, debes activar APIs de Google para autocompletar direcciones y geolocalizar. Además, es necesario obtener una clave API, que actúa como una “llave” para configurar la aplicación extra en el panel de administración de Palbin.
IMPORTANTE : para que Places y Geocoding funcionen, Google exige que tu proyecto tenga facturación (Billing) activada en Google Cloud (aunque luego puedas estar cubierto por el crédito gratuito, según tu caso).
Obtener API Key paso a paso
Accede a la plataforma de Google Cloud y crea una cuenta para tu ecommerce (en caso de que no la tengas) y accede a la consola.
0- Antes de habilitar APIs, asegúrate de que tu proyecto tiene Facturación / Billing configurada:
Menú > Facturación > vincula una cuenta de facturación al proyecto (si no lo has hecho ya).
1- Crea un proyecto nuevo para incluir tus credenciales. Para la creación de este debes acceder a Selecciona un proyecto > Proyecto nuevo en la zona superior izquierda.
2- Una vez creados tanto cuenta como proyecto, te encontrarás en el panel de inicio de Google Cloud Platform, haz click en Menú > APIs y servicios
3- En la parte superior del administrador de APIs accede a Library / Biblioteca (o “Enable APIs and services”), e inmediatamente después, busca la API llamada “Places API” (en algunos paneles puede aparecer como “Places API (New)”).
4- Habilita el producto seleccionado “Places API” y dando al botón “Habilitar”. Si no tenías ninguna clave API previa, te generará una clave API nueva. Esta será la que deberás incluir en la app extra de tu administración de Palbin. Recuerda seguir los siguientes pasos y restringirla (opcional) como indica en el último paso.
5- Una vez habilitada esta API, debemos habilitar otra para la geolocalización: busca y habilita también “Geocoding API” y “Maps JavaScript API” (Puedes usar el buscador de la biblioteca de APIs si no encuentras alguna en la interfaz).
Nota el autocompletado en web suele depender de la librería de Places dentro de Maps JavaScript API, por eso es importante que Maps JavaScript API esté habilitada además de Places y Geocoding.
6- Este paso solo es necesario si ya tenías una clave API creada anteriormente y en el paso 4 no te ha creado ninguna de forma automática.
Para finalizar la parte correspondiente a Google Cloud Platform, accede al menú de nuevo y busca “Claves y credenciales” (o APIs y servicios > Credenciales). Una vez has accedido a “Credenciales”, en la parte superior, haz click en “Crear credenciales” y selecciona “Clave de API”.
7- Una vez creada la Clave de API, puedes verla desde “Credenciales”, simplemente tienes que copiarla de la ventana emergente y pegarla en la aplicación extra de tu administración.
Restringir API Key paso a paso (opcional)
En este paso vamos a limitar el uso de la clave para que sólo pueda usarse en el dominio de tu tienda. Debes incluir el dominio tanto con https (https://www.mitienda.com/) como con http (http://www.mitienda.com/)
1- En la ventana anterior desde la que has copiado la API Key puedes proseguir el proceso haciendo click en “Edita la clave de API”.
Nota: En caso de haber cerrado el pop-up, accede de nuevo a la sección de APIs y Servicios > Credenciales y haz click en el lápiz que aparece a la derecha de la API Key que has creado anteriormente.
2- Para establecer las restricciones pertinentes tienes que seleccionar la opción “Sitio web” ya que la acción a realizar es para dominio y subdominio de tu tienda en Palbin.
En la parte inferior, pincha en “ADD” y añade tus dominios permitidos. Usa formatos como:
-
https://tudominio.com/* -
https://www.tudominio.com/*(si aplica) -
https://*.tudominio.com/*(si usas subdominios)
Si tu tienda fuerza https (lo habitual), no es necesario añadir http. Añádelo solo si realmente tu tienda carga bajo http.
3- Para finalizar el proceso, elige la opción “Restringir clave”, busca en el desplegable de las API y selecciona al menos las siguientes:
-
Places API
-
Geocoding API
-
Maps JavaScript API
Si estás usando otras APIs con esta misma clave API (ej: Maps Embed API) también debes seleccionarlas.
Nota (actualizado): esta clave, al restringirse como “Sitio web”, está pensada para uso en navegador. Si en algún caso tuvieras integraciones “server-side”, lo normal es usar otra clave distinta con restricciones de IP del servidor.
IMPORTANTE: Si estableces una clave API incorrecta, o no configurada correctamente, tus clientes no podrán establecer su dirección de envío.
Te recomendamos probarlo tú mismo para ver que funciona correctamente.