Cómo añadir funcionalidad de mapas con plantillas y plugins gratuitos de Elementor

Al crear un sitio web, elFunción de mapaes una herramienta muy útil, especialmente si desea facilitar a los visitantes la localización de su empresa o mostrar múltiples puntos de distribución de su negocio. Utilizando las plantillas gratuitas de Elementor y algunos plugins de terceros, puedes añadir muy fácilmente una función de mapa a tu sitio web.

¿Por qué necesitas la función de mapa?

Además de mostrar ubicaciones, las funciones de mapas están diseñadas para mejorar la experiencia del usuario. Por ejemplo, un sitio web de restaurantes puede permitir a los clientes encontrar la sucursal más cercana, un sitio web de viajes puede mostrar destinos, e inclusoSitio web de comercio electrónicoTambién se puede utilizar un mapa para ayudar a los clientes a comprender la ubicación real del producto.

Elegir la plantilla Elementor adecuada

Antes de empezar a añadir elementos al mapa, debe elegir un formato adecuado Plantillas Elementor. Muchas plantillas gratuitas de Elementor ya están diseñadas para ti con páginas comunes como página de inicio, sobre nosotros, datos de contacto, etc. Puede encontrarlas en la secciónbiblioteca de plantillasEncuentre la plantilla de diseño adecuada para usted en estas plantillas, que son hermosas a la vista y ricas en funciones para ayudarle a lanzar un sitio web con facilidad.

Integración de funciones cartográficas mediante plug-ins de terceros

Elementor no incluye su propia funcionalidad de mapeo, pero puedes ampliarla con plugins de terceros. Estos son algunos de los plugins más populares que funcionan a la perfección con Elementor. Integración con Elementorque le ayuda a añadir rápidamente funciones de mapa:

Mapa Google WP
WP Google Maps es un plugin de mapas muy popular que le permite poner Google MapsAñádelo a tu página. El plugin soporta marcado personalizado para las direcciones que desea mostrar, y la posibilidad de añadir ventanas emergentes para mostrar información más relevante.WP Google Maps ofrece una versión gratuita, y la funcionalidad básica ya es muy potente y suficiente para la mayoría de las necesidades.

Widget de mapa de Elementor
El plugin Elementor Map Widget es una gran opción para los usuarios que desean editar mapas directamente dentro del editor de Elementor. Este plugin te permite añadir fácilmente mapas a tu página mediante arrastrar y soltar y configurarlos directamente dentro de Elementor. Es compatible con Google Maps y los usuarios pueden ajustar los niveles de zoom de los mapas, los marcadores de ubicación y mucho más con una sencilla configuración.

Mapa del folleto
El complemento Leaflet Map es otra buena opción si desea evitar las limitaciones de Google Maps. Utiliza tecnología de código abierto para ofrecer una solución de mapas personalizada compatible con los tipos de mapas más comunes. El plugin también es gratuito y se integra perfectamente en Elementor.

Cómo añadir un mapa en Elementor

Tomando WP Google Maps como ejemplo, añadir mapas a tu página Elementor es muy sencillo. En primer lugar, debes instalar y activar el plugin WP Google Maps en el backend de WordPress. A continuación, sigue estos pasos:

entrevistas Consola de Google Cloud PlatformSi tienes un plugin WP Google Maps, busca la clave API y ponla en la configuración del plugin WP Google Maps.

Copie el shortcode generado por el plugin

Abra el editor de Elementor y seleccione la página a la que desea añadir un mapa.
En el panel del editor de Elementor, arrastra un widget HTML a la página.

En la configuración del widget HTML, pegue el código de incrustación del mapa generado por el plugin WP Google Maps.

Guarde y previsualice su página y verá que el mapa se ha cargado correctamente.

Si está utilizando Elementor Map Widget o Leaflet Map, los pasos son similares, sólo la configuración será diferente, pero ambos se pueden utilizar para añadir mapas arrastrando y soltando y ajustes simples.

Función de mapa personalizado

En la página del mapa, también puede personalizar el estilo del mapa para hacerlo más acorde con el estilo general del sitio. Por ejemplo, puede cambiar los colores del mapa, ajustar el estilo de los marcadores o añadir funciones interactivas al mapa, como la posibilidad de que los usuarios hagan clic en los marcadores para ver información más detallada.

Para las empresas que necesitan mostrar varias ubicaciones, como una cadena de restaurantes o una empresa repartida por varias ciudades, puede utilizar la función de marcadores múltiples del complemento, en la que cada marcador representa una ubicación y aparece información específica al hacer clic en el marcador. Esta experiencia interactiva aumenta la participación del visitante y mejora la experiencia del usuario.

Otros consejos para mejorar la experiencia del usuario

Garantizar la velocidad de carga de los mapas
Aunque la función de mapa es muy útil, si el mapa se carga lentamente, afectará bastante a la experiencia del usuario. Por lo tanto, a la hora de elegir un plugin de mapas, presta atención a su rendimiento y selecciona aquellos que se carguen rápidamente. Puedes mejorar tu sitio web instalando un plugin de caché u optimizando las imágenes para mejorar laVelocidad de carga.
Optimización móvil
Es importante asegurarse de que el mapa se visualiza bien en los dispositivos móviles, y la mayoría de los plug-ins de mapas admiten la funcióndiseño sensibleque puede cambiar automáticamente el tamaño de los mapas para adaptarlos a distintos tamaños de pantalla. Sin embargo, es necesario probar el rendimiento de la función de mapas para asegurarse de que funciona sin problemas en todo tipo de dispositivos.
Añadir información de contacto
Además del mapa, no olvide incluir información de contacto en la página. Puede colocar un sencillo formulario de contacto debajo del mapa o mostrar su número de teléfono y dirección de correo electrónico. De esta forma, los visitantes podrán ponerse en contacto rápidamente con tu empresa y aumentar las conversiones.

resúmenes

Los mapas pueden mejorar enormemente la interactividad y la experiencia de usuario de su sitio web, tanto si se trata de una única ubicación como de varios puntos de negocio. Elegir el plugin adecuado para garantizar que la funcionalidad de los mapas está personalizada, optimizada y adaptada para móviles permitirá a tus visitantes disfrutar de una experiencia de navegación más fluida.

Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas	Servicio de atención al cliente WeChat
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) Correo electrónico: info@361sale.com
④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres