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
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:
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:
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:
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í:
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:
Ahora, coloca el shortcode [mapmarker layer = "X"] en tu publicación o página. No olvides reemplazar el marcador de posición X 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.
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 :
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:
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:
Una vez que tenga varios marcadores, puede dibujar líneas entre ellos para mostrar las distancias:
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 :
También puede invitar a los miembros del equipo a usar sus correos electrónicos, para que puedan acceder de inmediato al mapa:
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 :
Ahora 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.
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 | Demo | alojamiento 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.
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.
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.
- Sus imágenes no se muestran con SSL? Aquí está la solución
- Cómo añadir un widget a la cabecera de tu blog de WordPress
- Cómo comprimir y redimensionar las imágenes en WordPress
- ¿Cómo presentar y compartir archivos PDF en WordPress?
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.
...