Cómo agregar un mapa interactivo en WordPress

¬ŅQuieres agregar un mapa interactivo en WordPress? Los mapas interactivos permiten a sus usuarios descubrir rutas, viajes e itinerarios haciendo clic en los marcadores en el mapa o moviendo el mouse. En este art√≠culo, le mostraremos c√≥mo agregar f√°cilmente un mapa interactivo en WordPress.

Agregar un mapa interactivo en WordPress

Video Tutorial

Suscríbase a WPBeginner

Si no le gusta el video o necesita m√°s instrucciones, contin√ļe leyendo.

Método 1: Agregar un mapa interactivo en WordPress usando Google My Maps

Este método es más simple y no requiere que instales un complemento en tu sitio de WordPress.

Primero, debe visitar el sitio web de Google My Maps y hacer clic en el bot√≥n “Crear un nuevo mapa”.

Crea un nuevo mapa

Esto lo llevará a la página de edición del mapa. En esta pantalla, puede crear su mapa seleccionando un mapa base, agregando puntos de interés, capas y más.

Edición de mapa

Usando la barra de herramientas en la parte superior, puede dibujar líneas en el mapa, agregar rutas, usar reglas y seleccionar elementos.

Usando la barra de herramientas del mapa

Todos los elementos del mapa se guardan en capas a la izquierda. Puede agregar, editar, renombrar o incluso eliminar capas. También puede hacer clic en cualquier elemento de su capa para agregar una descripción, cambiar el título o agregar fotos / videos.

Agregar descripciones

Una vez que haya terminado de editar su mapa, debe hacerlo p√ļblico para poder usarlo en su sitio web. Puede hacer esto haciendo clic en el bot√≥n compartir en el panel de edici√≥n.

Compartir tu mapa interactivo

Esto abrir√° el centro para compartir donde debe hacer clic en “Cambiar” en la secci√≥n “Qui√©n tiene acceso”.

Compartiendo ajustes

A continuaci√≥n, debe seleccionar “Activado – P√ļblico en la web” y luego hacer clic en el bot√≥n Guardar.

Hacer p√ļblico tu mapa

Despu√©s de eso, haga clic en “Listo” para cerrar el centro para compartir.

En el panel de edici√≥n, haga clic en el icono del men√ļ junto al nombre del mapa y luego seleccione “Insertar en mi sitio”.

Insertar mapa en el sitio

Ahora verá el código de inserción que necesita copiar.

Código de inserción

Luego, dirígete a la publicación o página donde deseas agregar tu mapa interactivo en WordPress. En la pantalla de edición posterior, debe cambiar al editor de texto y pegar el código de inserción del mapa que copió anteriormente.

Pegue su código de mapa interactivo en WordPress

Ahora puede guardar sus cambios y obtener una vista previa de su publicación para ver su mapa interactivo en acción.

Vista previa del mapa

Método 2: Agregar un mapa interactivo en WordPress usando el complemento

Si bien puede crear y agregar mapas interactivos con Google Maps, a√ļn carece de ciertas caracter√≠sticas y est√° limitado a Google Maps.

Si desea utilizar Open Street Maps, Bing u otros servicios de mapeo, entonces este método es para usted.

Lo primero que debe hacer es instalar y activar el complemento Maps Marker Pro. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

Tras la activaci√≥n, debe visitar Maps Marker Pro p√°gina para crear su mapa interactivo. Para comenzar, debe hacer clic en el bot√≥n “Agregar nueva capa”.

Agregar una nueva capa a tu mapa

A continuación, debe proporcionar un nombre para su capa y hacer clic en publicar.

Crear una nueva capa y publicarla

Ahora que ha creado una capa, est√° listo para agregar marcadores de mapa en ella. Ir Maps Marker Pro ¬ĽAgregar nuevo marcador p√°gina para agregar su primer marcador.

Agregar primer marcador

Primero deberá ingresar un título para el marcador, y luego buscar la ubicación y seleccionarla.

También deberá colocar su marcador en la capa que creó anteriormente. Puede hacerlo escribiendo el nombre de la capa en el campo de capas y selecciónelo.

No olvides hacer clic en el bot√≥n “Publicar” para guardar tu marcador.

Repita el proceso para agregar otros marcadores a la capa.

Una vez que haya terminado de agregar marcadores, puede editar cualquier publicación o página de WordPress donde desee agregar el mapa.

En la pantalla de edici√≥n de publicaciones, haga clic en el bot√≥n “Agregar mapa”.

Agregar botón de mapa

Aparecerá una ventana emergente que muestra todos tus marcadores de mapa y la capa que creaste anteriormente. Debe seleccionar la capa y hacer clic en el botón Insertar mapa.

Seleccione e inserte la capa del mapa en su publicación o página

El complemento agregará el shortcode requerido en su área de editor de publicaciones. Ahora puede guardar o publicar su publicación y obtener una vista previa para ver su mapa interactivo.

Obtenga una vista previa de su mapa interactivo

Siempre puede editar su capa principal para ajustar el tama√Īo y las dimensiones del mapa.

Maps Marker Pro es un complemento poderoso con toneladas de opciones como mapas de m√ļltiples capas, marcadores personalizados, direcciones, soporte GPX, mapa de exportaci√≥n en m√ļltiples formatos y m√°s. Puede explorar estas opciones para que sus mapas sean a√ļn m√°s interactivos.

Esperamos que este artículo te haya ayudado a aprender cómo agregar un mapa interactivo en WordPress. También puede ver nuestra lista de los mejores complementos de Google Maps para WordPress.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para ver videos tutoriales de WordPress. También puedes encontrarnos en Twitter y Facebook.