Incluir un mapa de Google en un sitio web es una de las mejores estrategias para potenciar el SEO local.
Si se desea obtener más visitas en la tienda o negocio físico, destacar sobre la competencia y ayudar a fortalecer la reputación de la empresa, los mapas de Google son la opción más sencilla y efectiva.
Por estas razones en este artículo enseñamos como incluir un mapa de Google Maps correctamente en un sitio web DIVI, con dos métodos sencillos.
¿Cómo insertar un mapa de Google maps con Divi?
Existen dos métodos con los que podemos incluir un mapa de Google en un sitio web construido con el tema Divi.
- Con el módulo de mapas del constructor Divi.
- Con el código de inserción de Google Maps.
Insertar un mapa de Google Maps en un sitio web Divi usando el módulo de Mapa
La ventaja de este método es que muchas plantillas para Divi traen diseños especiales para los mapas de Google.
Solo hay que configurar la cuenta de Google My Bussines en Divi para que el mapa quede totalmente combinado e integrado con el diseño del sitio web.
También se ofrecen otras opciones prácticas para los usuarios como enviar el mapa al teléfono inteligente o ver las opciones de contacto en un solo clic. Y se obtienen mejores resultados en cuanto al SEO.
La desventaja de este método es que es necesario tener la API de Google para que pueda funcionar, y las APIs no son gratuitas.
Aunque para pequeñas empresas no se cobra el funcionamiento de las APIs, si el sistema detecta que el uso supera los límites establecidos para cuentas gratuitas se cobrará una tarifa hasta que el uso se vuelta a estabilizar. Requiere que se ingrese una tarjeta de crédito para el pago.
Lo primero es insertar una nueva fila justo donde se quiere mostrar el mapa. Se puede configurar el tamaño de la fila, pero se recomienda una fila de tamaño completo para que se vea bien y llame la atención.
Insertar el módulo de Mapas de Divi.
Iniciar sesión en el sitio de Google My Bussines, buscar la clave API y copiarla.
En el módulo de mapa de Divi insertar la clave API de Google My Bussines.
Cuando la autenticación de la clave se complete el mapa debería verse y funcionar correctamente.
Insertar un mapa de Google en un sitio web Divi usando un enlace directo
Este método es totalmente gratuito, pero su desventaja es que hace falta más configuración para obtener un buen resultado.
En cuanto al SEO, por supuesto Google le da más prioridad a los sitios web que empleen el método anterior, pero si el sitio ya cuenta con un buen SEO Offpage, los resultados en las búsquedas para los mapas también serán buenos.
Para empezar se debe buscar el negocio por su nombre en los Mapas de Google. Se debe hacer de esta manera y no introduciendo la dirección física del sitio porque así Google Maps marca el lugar con la flecha roja destacándolo.
Usando los botones de maximizar o minimizar del mapa, ubicados en la parte inferior derecha, se debe ajustar el mapa según lo deseado.
A continuación, ir al menú de opciones del lado izquierdo arriba (representado por 3 líneas horizontales) y hacer clic en “Compartir o incorporar mapa”.
En la nueva pantalla clicar en “Incorporar mapa” y en las opciones de tamaño escoger “Tamaño personalizado”.
Escoger un tamaño en pixeles que se ajuste al tamaño de la fila que se ha insertado en el constructor Divi. Si no se sabe el tamaño de la fila, lo mejor es ir cambiando los tamaños hasta dar con el necesario. Se puede usar la opción “Vista previa” para ver el tamaño aproximado. Para una fila completa de Divi un buen tamaño es 1200×600 pixeles.
Ahora se debe copiar el código de inserción haciendo clic en “Copiar HTML”.
Volviendo al constrictor Divi, en la fila designada agregar el módulo de códigos de Divi.
En la pestaña contenido del módulo código pegamos el código de Google Maps. Guardando las configuraciones del módulo ya debería verse el mapa.
Con estas configuraciones es suficiente para tener un mapa funcional, pero si se quiere más personalización entonces se debe jugar con los ajustes de diseño para conseguir un mapa totalmente combinado con la página web.
Personalizar la apariencia de un mapa de Google en un sitio web creado con Divi
Yendo a las configuraciones de la fila que contiene el mapa, en la pestaña diseño, se puede establecer un borde de color para el mapa y también arreglar los márgenes para conseguir un ajuste aún más preciso.
Entrando en la misma pestaña, pero esta vez del módulo de código de Divi, en la opción filtro se puede ajustar las opciones de color, saturación y brillo.
Si se quiere un mapa en blanco y negro se puede ajustar la saturación. Con la tonalidad se puede hacer que todo el mapa adquiera un tinte más azul, rojo, verde o amarillo y que así combine mejor el diseño del sitio.
Después de conseguir el diseño deseado es preciso guardar y confirmar los cambios de forma general en el constructor Divi, también guardar la página en WordPress antes de publicarla.
Esperamos que este artículo te haya ayudado. Si fue así, por favor compártelo en tus redes sociales para que más webmaster puedan beneficiarse de tener un mapa bien integrado en su sitio web Divi.