• Características
  • Plantillas
  • Precios
  • Spanish
  • Características
  • Plantillas
  • Precios
  • Spanish
¡Ops! No se ha encontrado el widget buscado. ¿Tienes alguna idea? En caso afirmativo, Envíe aquí

Incrustar el mapa de Google en tu página web es muy útil para las tiendas y comercios online. De una manera ayuda a la gente a llegar a usted, de otra manera, usted puede marcar su tienda a nivel mundial. Hoy, vamos a hablar de cómo se puede incrustar Google Maps en WordPress utilizando Elementor page builder.

En primer lugar, Elementor tiene Mapa de Google que puede utilizar para este asunto. Sin embargo, sus opciones de estilo son limitadas. Por lo tanto, hoy vamos a utilizar Mapa Google avanzado widget de Element Pack.

No hacen falta más presentaciones. ¡Empecemos!

Guía completa para incrustar Google Map en WordPress

Siempre que desee utilizar google map en WordPress, es necesario insertar un API en tu panel de control. Usando esta clave, tienes que autenticarte como usuario en Google. Veámoslo en imágenes.

Inserting Advanced Google Map Widget

En primer lugar, inserte el Mapa Google avanzado en su sitio web.

Inserting Advanced Google Map Widget

En cuanto arrastres y sueltes el widget, aparecerá un mensaje emergente. Para que el mapa funcione correctamente, el sistema te pedirá la clave API. Veamos cómo hacerlo.

API settings for Embed Google Map on WordPress

Ir a WordPress Cuadro de mandos> Element Pack> Ajustes API.

Aquí puede ver un campo denominado Clave API de Google Map. Ahora tienes que poner tu clave API en la casilla y guardar. Sin embargo, puede obtener la clave para su mapa de Google incrustar en WordPress desde aquí.

Blog para usted
Blogs más populares

Más información sobre WordPress

Personalización de la pestaña Contenido del mapa de Google

Ahora, vamos a cambiar el aspecto del mapa a tu gusto. En esta parte, vamos a hablar de la configuración del widget.

Widget Settings of Embed Google Map on WordPress

Como en la imagen de arriba, lo primero que verás es el Mapa de Google sección. Se encuentra en la sección Ficha Contenido. Contiene los ajustes básicos del mapa. Los conmutadores de la pantalla muestran/ocultan principalmente los botones/funciones correspondientes en el mapa.

Por lo tanto, puede mostrar/ocultar el botón de zoom, cuadro de búsqueda, tipo de mapa y Vista de la calle control desde aquí. Además, también hay zoom mapa, altura del mapay cuadro de búsqueda espaciado aquí. Además, puede ver el mapa en Satélite modo o Calle modo.

Widget Settings

La siguiente sección es Marcador. Por supuesto, puedes colocar un número infinito de marcadores utilizando el widget Google Map avanzado. Cada marcador tiene campos como Latitud, Longitud, Títuloy Contenido. Sin embargo, al utilizar los dos primeros, es necesario especificar la posición del marcador.

Otro punto clave es que puedes añadir iconos personalizados como marcadores. Sin embargo, esta función no se encuentra en ningún otro widget de mapas. Esta función es exclusiva para los usuarios de Element Pack.

Blog popular

Cómo utilizar el widget Iframe en Elementor por Element Pack

Estilos únicos de la incrustación de Google Map en WordPress

Hasta este punto, todo lo que hicimos fue configurar el diseño. Ahora, vamos a cambiar la perspectiva de la incrustación google map en WordPress utilizando Elmentor.

Customizing The Style Tab of the Google Map

Una vez más, la pestaña de estilo tiene dos secciones. Con la sección Estilo GMap puedes insertar cualquier skin en tu mapa. Estas skins cambian los detalles de todo el mapa. Por lo tanto, sólo tiene que pegar el código JSON en el campo marcado. Además, puede utilizar el botón Filtros CSS para más estilo.

Snazzy Maps Website

Además, puede importar los códigos JSON de Snazzymaps. Tienen muchos skins de mapas gratuitos y premium disponibles a un precio barato.

 

Customizing The Style Tab of the Google Map

Por último, el cuadro de búsqueda de la parte superior del mapa también es editable. Es muy fácil cambiar su aspecto. También puede cambiar el color, el tipo de borde, el radio del borde y añadir una sombra al cuadro de búsqueda. Asegúrate de que el producto final atrae las miradas de los visitantes.

Conclusión

Examples of Advanced Google map

Enhorabuena. Has aprendido con éxito todo el proceso. Con este blog, espero que puedas hacer incrustar google map en WordPress usando Elementor fácilmente. Para más información, por favor visite nuestra base de conocimientos. Sin más dilación, manténgase a salvo. Gracias por leer este blog.

Derechos de autor © 2025 BdThemes. Todos los derechos reservados.

Money Transfer Logo