Si usa un servicio como Google Maps, simplemente elija una ubicación e incruste el mapa en su sitio web. Sin embargo, no puede editar mapas sobre la marcha, ni tampoco sus compañeros de trabajo, lo que a menudo es necesario para proyectos colaborativos.

Aquí es donde entran los mapas interactivos. Le permiten colocar marcadores móviles que todos los miembros de su equipo pueden editar. 

En este tutorial, vamos a hablar sobre cuándo es útil este tipo de tarjeta. Además, le mostraremos cómo agregarlos de dos maneras a WordPress.

Pero antes de comenzar, tómese el tiempo para echar un vistazo a Cómo instalar un tema de WordPress¿Cuántas plugins debería instalar en WordPress.

Entonces, mvamos a trabajar!

¿Qué es un mapa interactivo (y cuándo usarlo?)

Agregar un mapa a un sitio web es bastante sencillo. Herramientas como Google Maps le permite insertar mapas en sus páginas en minutos. La ventaja de este enfoque es que los visitantes pueden moverse por los mapas, acercar, alejar, etc.

Estos tipos de mapas son más interactivos que solo imágenes, pero no le permiten realizar ningún cambio una vez que los ha agregado a su sitio web.

Por otro lado, los mapas interactivos te permiten (y en algunos casos, a tus colegas) agregar nuevos marcadores, íconos, textos y más. Imagine, por ejemplo, que está planificando una reunión para miembros de su sitio web. Puede configurar un mapa con varios pines para sugerir ubicaciones.

Descubre por cierto Los complementos de 5 WordPress para agregar geolocalización a tu blog

También puede utilizar un mapa interactivo para que sus usuarios puedan compartir sus ubicaciones o navegar a los lugares que desean visitar. Para ser más precisos, estas son aplicaciones de nicho. Sin embargo, los mapas interactivos  lata  Ser útil en una amplia variedad de situaciones. 

Además, no son necesariamente más difíciles de agregar que sus contrapartes.

Cómo agregar mapas interactivos a su sitio de WordPress

Cuando se trata de mapas interactivos, puede insertar uno en su sitio web o usar un complemento para ayudarlo a hacerlo. El primer enfoque es más simple, pero los complementos a menudo incluyen muchas más funciones, como es de esperar. Repasemos el enfoque del complemento para mostrar cuáles son estas características.

1. Utilice el complemento Maps Marker Pro

Usar map maker pro

El complemento Maps Marker Pro es una solución premium integral para agregar mapas a WordPress. Viene con docenas de funciones avanzadas, como las que le permiten ver mapas de varios departamentos y agregar una cantidad virtualmente ilimitada de marcadores a sus mapas y organizarlos. Además, los visitantes pueden filtrar los tipos de marcadores que desean ver en sus mapas.

Otras cosas divertidas que puede hacer con este complemento es agregar información de distancia y ruta entre marcadores. Incluso puede compartir su propia ubicación en tiempo real a través del mapa de su sitio web, si está dispuesto a hacerlo. La configuración del complemento puede llevar un poco de tiempo, dada la gran cantidad de funciones que ofrece. 

Sin embargo, no es tan difícil como imagina. 

Para comenzar, configure y active el complemento como lo haría con cualquier otro. Si eres nuevo en WordPress, descúbrelo Cómo instalar un plugin en WordPress

Una vez que el complemento esté listo, debe agregar un nuevo mapa o capa, lo que puede hacer desde la pestaña Maps Marker Pro> Agregar una nueva capa. Aquí, establezca un nombre que pueda reconocer para su capa e ingrese la ubicación que desea que se muestre, tal como lo haría con cualquier otra herramienta de mapeo en línea:

Agregar una nueva capa

Ahora puede ajustar el tamaño y el nivel de zoom que desea establecer como predeterminado, usando el menú de la izquierda. También hay una opción llamada Agrupación de marcadores , que mostrará un icono con la cantidad de marcadores en un área si se acerca demasiado, como en el siguiente ejemplo:

Mostrar un marcador

la opción Marcadores de búsqueda, por otro lado es bastante explícito. Puede ser útil si desea incluir información adicional sobre sus marcadores:

Lista de marcadores

Ahora desplácese hacia abajo y busque la opción « Añadir un nuevo marcador en esta capa« . En la siguiente pantalla, podrá definir un nombre y una ubicación para su marcador, utilizando el mismo mapa que el anterior.

Descubrir también Cómo comprimir y redimensionar las imágenes en WordPress

También puede elegir un icono y configurar un texto emergente para su marcador. Esto aparecerá cuando los visitantes hagan clic en el marcador en sí, o lo seleccionen de una lista si ha optado por incluirlo.

En cualquier caso, no olvide presionar el botón Cuestión cuando haya terminado. Después de agregar algunos marcadores, su capa inicial debería verse así:

Ejemplo de una capa en un bloque

Cuando esté listo para agregar su nuevo mapa interactivo a una de sus páginas, debe usar un Código corto. Desplácese hasta la parte superior de la pestaña. Editar capa  y busque su identificación correspondiente:

Guardar identificadores de tarjetas

Ahora, coloca el shortcode [mapmarker layer = "X"] en tu publicación o página. No olvides reemplazar el marcador de posición  por el ID de su "capa" de antemano, sin embargo.

¡Su tarjeta ahora debería estar operativa en su sitio web! Más importante aún, usted o cualquier otra persona en su equipo puede editarlo y agregar nuevos marcadores en cualquier momento, sin salir de su tablero.

2. Usando la función de inserción incorporada de Mapa de Google

Google Maps realmente no necesita una presentación: es un servicio que le permite extraer mapas de todo el mundo para compartir lugares con otras personas, encontrar direcciones e incluso compartir dónde se encuentra. Cuando se trata de sitios web, hay muchas formas de integrar Google Maps en sus páginas. Guardar mapas con google map

Sin embargo, la mayoría de las tarjetas ofrecen una cantidad limitada de interactividad. Le permiten navegar a través de ellos, acercar, salir y cambiar su vista, pero nada más.

El hecho es que Google Maps ofrece muchas más funciones que el mapeo simple. Por ejemplo, también puede agregar múltiples marcadores, medir distancias e incluir direcciones en sus mapas. Para probar estas funciones, vaya a Mis mapas de Google y haga clic en el botón  + Crear un nuevo mapa  :

Crea un mapa en google map

En la siguiente pantalla, establezca un título para su mapa y su primera capa, sobre la cual construiremos. Ahora busque la ubicación que desea compartir usando la barra de búsqueda de Google Map en la parte superior de la pantalla:

Nuevo mapa y ubicación del mapa de Google

A medida que se acerca, puede usar el símbolo del marcador en la parte superior de la pantalla para comenzar a resaltar ubicaciones en su mapa. Simplemente haga clic donde desea colocar su marcador, luego establezca un nombre y un ícono para él:

Agregue un marcador a su nuevo mapa.

Una vez que tenga varios marcadores, puede dibujar líneas entre ellos para mostrar las distancias:

Mostrar una distancia entre dos puntos en el mapa

Cuando su tarjeta esté lista, haga clic en el botón Compartir en el menú de la izquierda. Allí, cambia la configuración de acceso  de privado  à público :

Definir el acceso a la tarjeta

También puede invitar a los miembros del equipo a usar sus correos electrónicos, para que puedan acceder de inmediato al mapa:

Mapa de colaboración con socios

En cualquier caso, siempre debe insertar su nueva tarjeta en su sitio web. Puede hacer esto haciendo clic en el icono de tres puntos junto al título de su mapa y haciendo clic en la opción Insertar este mapa  :

Mapa incrustadoAhora puede copiar y pegar el código de inserción en sus páginas. Su nueva tarjeta aparecerá donde sea que la coloque. Además, sus colegas podrán editarlo y agregar nuevos marcadores a través de Google Maps si es necesario.

Descubre también algunos complementos premium de WordPress  

Puedes usar otros plugins de WordPress para dar una apariencia moderna y optimizar el manejo de tu blog o sitio web.

Aquí le ofrecemos algunos complementos premium de WordPress que lo ayudarán a hacerlo.

1. Captcha de matemáticas definitiva

Ultimate Math Captcha es un Plugin de WordPress Captcha premium 100% efectivo. Permite añadir un captcha matemático en la formas Inicio de sesión de WordPress, registro, recuperación de contraseña, comentarios, WooCommerce, Easy Digital Downloads y aux formas de bbPress.Complemento de wordpress captcha de matemáticas definitivo

Sus características incluyen: fácil instalación y configuración, agregando captcha a muchos formas, soporte para múltiples captchas matemáticos en la misma página, personalización de mensajes de error y muchos otros.

Descargar | Demoalojamiento web

2. Gateway de pago estándar de PayPal para formularios Ninja

La pasarela estándar de PayPal para formularios Ninja le permite crear formularios que se integran perfectamente con la pasarela de pago de PayPal. Podrá crear formularios de pedido personalizados y recibir pagos utilizando cuentas estándar de Paypal.

Pasarela de pago estándar de Paypal para formularios ninja

Sus principales características son: integración fácil y rápida, integración IPN, la posibilidad de activar / desactivar la pasarela de PayPal en formularios individuales, soporte para pagos regulares, etc.

Descargar | Demo |  alojamiento web

3. Formularios de gravedad: lista y edición

con este Plugin de WordPress premium, es posible modificar o eliminar las entradas enviadas en los formularios de su sitio web. Una característica que falta en el complemento Gravity Forms, razón por la cual se creó esta extensión.Lista de formularios de gravedad editar plugins de wordpress insertar tablas gráficos formulario de blog del sitio

Entre sus características mencionaremos entre otras: la medición y guardado de los datos grabados, eluppression de los datos ingresados, elmodificación y eliminación de artículos ya publicados, el iIntegración perfecta con los complementos de jQuery Datatables y Formas de gravedad, lassoporte de lógica condicional, simple y rápido de instalar, y mucho más.

Descargar Demo | alojamiento web

Recursos recomendados

Conozca otros recursos recomendados para ayudarlo a construir y administrar su sitio web.

Conclusión

Listo ! Eso es todo por este tutorial, espero que te permita crear mapas interactivos en WordPress. No dude en comparte con tus amigos en tus redes sociales favoritas

Sin embargo, también puedes consultar nuestros recursos, si necesita más elementos para llevar a cabo sus proyectos de creación de sitios de Internet, consulte nuestra guía sobre Creación de blog de WordPress.

Si tienes sugerencias o comentarios, déjalos en nuestra sección comentarios.

...