Plugin para Geolocalización en WordPress con un marcador en Google Maps utilizando Woocommerce 2021

enero 1, 2021
Oscar

Buenas tardes Negociante, Marketer o Dueño de Negocio, debido a la cantidad de visitas y búsquedas de esta solución, he actualizado el artículo a ENERO del 2021. Aun recibo muchas preguntas por email y puedo confirmarte que el plugin sigue funcionando. Varias personas de diferentes partes de Latinoamérica lo han configurado en sus sitios con éxito.

Entrando en materia, te comparto los pasos para configurar un plugin para Geolocalización en WordPress, lo puedes encontrar aquí:  Descargar Plugin o si te suscribes a mi plataforma de Cursos en línea con tu membresía puedes descargarlo sin costo adicional por $10 dlls. mensuales, te comparto mi plataforma:

Este plugin sirve para que nuestro cliente nos indique la ubicación de entrega con un PIN en el Mapa de Google al momento de realizar una compra en nuestro sitio web.

Esta solución es ideal si vendes en línea y utilizas woocommerce, ya que como sabemos las direcciones aquí en México u otros países de Latinoamérica no están muy completas o son un poco complicadas de encontrar. Imaginemos una negocio de comida que desea entregar sus pedidos o una tienda de regalos que cuente con compras en línea es ideal.

¿Qué necesitamos para que funcione correctamente?

  1. Debes tener una tienda en línea en WordPress con Woocommerce
  2. Puedes contratarme por $49dlls. (clic aquí +info) y te ayudo a hacer la integración (te incluye el plugin) o puedes comprarlo en Themeforest, aquí lo puedes comprar:  Descargar Plugin
  3. Cuenta en Google Cloud para generar tu API de geolocalización
  4. Certificado de seguridad instalado en tu dominio o puedes utilizar el que regularmente te da gratis tu proveedor de hosting (Certificado de cPanel)
  5. Una taza de café bien cargado

TIP:  Si estas teniendo muchas visitas a tu tienda en línea y no está convirtiendo (generando ventas) muy seguramente es porque los usuarios no se encuentran en un funnel de ventas. Te recomiendo esta Herramienta para CREAR TU FUNNEL DE VENTAS dale clic aquí.

via GIPHY

¡Pasemos a la acción!

Una vez que compras el plugin directamente en Themeforest y lo descargas viene comprimido, así que es necesario descomprimirlo y quedará de la siguiente manera:

Al darle doble clic entrarás a la carpeta PLUGIN y dentro encontrarás un archivo comprimido de nombre:

woocommerce-nw-location-picker.zip

Es importante mencionarte que ese archivo está comprimido, no es necesario que lo descomprimas, puesto que tu instalación de WordPress lo reconocerá sin problema.

Lo siguiente que haremos es en tu BACKEND (parte trasera o administración) de tu sitio web ve a la ruta:  PLUGINS -> AÑADIR NUEVO -> SUBIR PLUGIN

Estando en esa ruta de tu backend haz clic donde dice "Seleccionar archivo" y buscas el plugin comprimido con extensión .zip, dale clic en "Abrir", después "Instalar ahora" y por último "Activar Plugin"

Hasta este punto ya lo tendremos instalado y activado, lo siguiente es la configuración.

Para ir a la configuración es necesario ir a la siguiente ruta en tu BACKEND:   AJUSTES -> LOCATION PICKER y la configuración debe de quedar de la siguiente manera:

Nota: En el campo "Default Location Latitude" (& Longitude) ponemos la coordenada que deseamos que aparezca de forma predeterminada.

Para definir nuestra coordenada predeterminada vamos al siguiente enlace y ponemos el pin donde queramos mostrar la ubicación predeterminada.

Ejemplo:   Clic aquí para definir Latitud y Longitud

Para el ejemplo utilizaré una coordenada de Hermosillo, Sonora, México y la puedes ver en la siguiente imagen:

Hasta este paso, ya tenemos el plugin instalado y configurado, ahora necesitamos generar la API key en la plataforma de Google para utilizar sus servicios.

Para ello es necesario que te registres en Google Cloud, te dejo el enlace directo:

https://cloud.google.com/maps-platform

Al registrarte te pedirá des de alta una tarjeta de débito o crédito con la finalidad de que respaldo el uso que le das al servicio, ya que tiene costo. Sin embargo, Google te da sin costo $300 dlls. mensuales que equivalen a una cantidad de consultas determinada, si vas iniciando, no será problema.

Cuando tengas bastante tráfico será necesario que consideres esas solicitudes en tu costo de mantenimiento. Cada vez que un usuario llega hasta este punto donde hace la compra y le pide permitir la ubicación se traduce en una solicitud para Google.

Primeramente tienes que crear una API key, le puedes poner el nombre de tu proyecto.

Como segundo paso es necesario que habilites los siguientes servicios en la API y lo haces de la siguiente manera:

MENU -> API Y SERVICIOS -> PANEL

Es importante mencionarte que en el campo desplegable debe de mostrarse el nombre del proyecto que creaste y como paso número dos haces clic en el botón "HABILITAR API Y SERVICIOS"

Una vez que damos clic en el botón de "HABILITAR API Y SERVICIOS" nos llevará a la biblioteca para buscarlos y prenderemos los siguientes servicios, uno por uno:

Buscamos uno por uno y le damos clic en "HABILITAR", una vez habilitado le damos regresar en el navegador y prendemos el siguiente, así hasta prender los 4:

  • Geocoding API
  • Maps JavaScript API
  • Distance Matrix API
  • Maps Static API

Una vez habilitados los servicios, necesitamos crear las credenciales mediante la siguiente ruta:   MENU -> API Y SERVICIOS -> PANEL -> CREDENCIALES -> CREAR CREDENCIALES -> CLAVE DE API

Automáticamente nos genera una llave API y esta es la que pondremos en la configuración de nuestro plugin

Hasta aquí hemos terminado la configuración y resta hacer la prueba.

Solo ve a tu tienda en línea, agrega un producto, lleva la compra hasta donde es necesario agregar la información de entrega, ahí pedirá el navegador que permitas detectar tu ubicación y se mostrara un PIN con la ubicación de donde te encuentras en ese momento, a eso se le conoce como una solicitud de API, te pongo el ejemplo a continuación.

Y al permitir detectar la ubicación más abajo nos mostrará el mapa con nuestra ubicación aproximada, la cual podemos fijar a merced moviendo el pin.

Asegúrate que el Plugin para Geolocalización WordPress
funcione correctamente

Te recomiendo que fuerces todo el tráfico hacia el protocolo https, solo es necesario instalar y activar el siguiente plugin:

Really Simple SSL

Te dejo el enlace directo:

https://wordpress.org/plugins/really-simple-ssl/

Esto es recomendable para que funcione correctamente y no se despliegue contenido con protocolo mixto, es decir http y https.

Si quieres más tips de WordPress y aprender más visita mi blog aquí:

IR AL BLOG

Espero que no te haya quedado alguna duda, en caso contrario puedes escribirme aquí en mi web o enviarme un correo a info@tijuanamovil.com

¡Nos vemos!
Óscar Ramírez

Comentarios via Facebook

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

¿Tienes dudas? 👀

Si se te complica un poco, te entiendo perfectamente, yo también pasé por ahí y esa es la razón principal por la que me gusta compartir el conocimiento.
¡EMPECEMOS!

Recibe consejos para mejorar tu web

Únete a mi boletín mensual y aprende a usar las herramientas más nuevas de WordPress y Marketing Digital.

¡Te inscribiste con éxito!

linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram