¿Quiere agregar el autocompletado de direcciones de Google al finalizar la compra de su tienda WooCommerce? ¡Estás en el lugar correcto!
La función de autocompletar de direcciones de Google mejora la experiencia del cliente y reduce los errores del usuario al sugerir direcciones postales en tiempo real mientras el cliente escribe su dirección en el formulario de pago.
Dado que el núcleo de WooCommerce no se integra con el autocompletado de direcciones de Google de forma inmediata, necesitará un complemento de terceros para agregar esta funcionalidad a su tienda.
En este artículo, lo guiaré para habilitar el autocompletado de direcciones de Google en WooCommerce utilizando un poderoso complemento llamado Merchant Pro.
Empecemos.
1. Instale y active el complemento Merchant Pro
Merchant Pro es un complemento WooCommerce todo en uno que ofrece más de 40 módulos diseñados para mejorar la experiencia de compra de su tienda y aumentar las tasas de conversión. Uno de estos módulos es Autocompletar dirección de Google.
Para comenzar, simplemente compre, instale y active el complemento Merchant Pro en su tienda:
2. Genere una clave API de Google Places
Para agregar el autocompletado de direcciones de Google al proceso de pago de su tienda, debe integrar Google Places en su tienda WooCommerce mediante una clave API.
A continuación se explica cómo generar una clave API de Google Places:
i. Iniciar sesión en la consola de Google Cloud
Para generar una clave API de Google Places, abra el Consola de Google Cloud e inicie sesión con una cuenta de Google nueva o existente.
ii. Crear una cuenta de facturación
En el panel de Google Cloud, lo primero que debe hacer es crear una cuenta de facturación. Este es un paso obligatorio.
No te preocupes, no se te cobrará nada todavía.
Ve a la Facturación opción en el lado izquierdo de la pantalla:
Se le pedirá que complete un formulario y agregue una tarjeta de crédito o débito.
Haz eso, luego presiona el Comience gratis y se creará su cuenta de facturación:
Después de crear la cuenta, Google le dará un crédito gratuito de $200 cada mes por utilizar los siguientes servicios de Google: Mapas, Rutas y Lugares.
Puede utilizar este crédito para utilizar la API de Google Places en su tienda WooCommerce.
Siempre y cuando su uso no exceda el crédito mensual de $200, no se le cobrará por separado.
Sin embargo, si su uso excede el crédito mensual de $200, se le facturará el uso adicional que supere ese monto (ver precios).
Asegúrate de saber Cómo utiliza la API de Places el crédito gratuito y cómo realizar un seguimiento de ese uso de crédito.
Puede verificar su uso de crédito yendo a Facturación → Créditos:
III. Crear un proyecto
En el panel de la consola, vaya a Seleccione un proyecto opción en la barra superior y presione el Nuevo proyecto botón en la ventana emergente:
Nombra el proyecto como ‘Autocompletar dirección de Google’ o cualquier otra cosa que se adapte a tu propósito y presiona el botón Crear botón:
La Consola tardará unos segundos en preparar el proyecto.
Una vez que esté completo, abra el panel del proyecto seleccionando el nombre del proyecto en la barra superior:
IV. Habilite la API de Google Places
Para acceder a la API de Google Places, vaya a API y servicios → Biblioteca:
En la biblioteca API, ingrese ‘API de Google Places’ en la barra de búsqueda y selecciónela cuando aparezca en la pantalla:
En la siguiente pantalla, haga clic en el Permitir botón para habilitar la API de Google Places:
v. Crear una clave API
Para crear una clave API de Google Places, vaya a API y servicios → Credenciales:
Haga clic en el Crear credenciales botón ubicado en la parte superior de la página y seleccione el Clave API opción:
Inmediatamente, aparecerá una ventana emergente con una clave API:
En la página siguiente, puede restringir el acceso a su clave API para evitar que otros usen sus créditos gratuitos de Google Cloud.
Para hacerlo:
- Agregue un título a la clave API.
- Bajo la ‘Establecer una restricción de aplicación‘ encabezado, elija el Sitio web opción.
- Añade tu nombre de dominio.
- Bajo Restricciones de APIhaga clic en el Restringir clave opción.
- En el menú desplegable, seleccione el API de lugares.
- Golpea el Ahorrar botón.
Nota: Antes de agregar el nombre de dominio, asegúrese de leer «¿Cómo puedo restringir mi clave API a sitios web específicos?» sección a la izquierda de la pantalla para aprender cómo agregar su dominio a la clave API:
Después de golpear el Ahorrar la clave API tardará unos minutos en activarse.
Mientras se activa, procedamos con los siguientes pasos.
Si necesita ayuda para crear la clave API, consulte estos documentos de ayuda o buscar ayuda del Comunidad de la nube de Google.
3. Abra el módulo de autocompletar de direcciones de Google.
Después de instalar el complemento Merchant, verá un Comerciante La opción aparece en su menú de WordPress. Seleccione esa opción y lo llevará al panel del comerciante.
En el panel del comerciante, vaya a Mejorar la experiencia y abre el Autocompletar dirección de Google módulo:
4. Ingrese su clave API de Google Places
Dentro del módulo, pegue la clave API de Google que creó en el Paso 2.
También puede agregar parámetros adicionales a la URL de API usando el Parámetros de URL de API opcionales configuración, como idioma, región y otros (Vea la lista completa aquí):
5. Habilite el módulo de autocompletar de direcciones de Google
Cuando estés listo, pulsa el azul. Permitir Botón para activar el módulo.
Asegúrate de Ahorrar sus cambios antes de salir de la página:
6. Verifique la función de autocompletar de direcciones de Google en su página de pago
Después de habilitar el módulo, le recomiendo que verifique si funciona correctamente en la página de pago de su tienda WooCommerce.
Así es como se ve el autocompletado de direcciones de Google en la página de pago de mi sitio de demostración:
Conclusión
Habilitar la función de autocompletar de direcciones de Google es una excelente manera de acelerar el proceso de pago y reducir los errores de los usuarios.
Aquí hay un resumen rápido sobre cómo usar el complemento Merchant Pro para agregar el autocompletado de direcciones de Google a su tienda WooCommerce:
- Compre, instale y active el complemento Merchant Pro.
- Abra Google Cloud Console y genere una clave API de Google Places.
- Abra el módulo Autocompletar de direcciones de Google en Merchant Pro e ingrese la clave API de Google Places.
- Habilite el módulo y consulte la página de pago de su tienda.
Si tiene alguna pregunta sobre cómo habilitar la función de autocompletar de direcciones de Google en su tienda WooCommerce, háganoslo saber en la sección de comentarios a continuación.
