My Maps location : ubicaciones y categorías

1. Obtenga una clave de API de Google Maps

Cada vez que utilice las API de Google Maps, si su dominio se creó después del 22 de junio de 2016, debe incluir una clave para validar su solicitud.
Obtenga una clave y habilite la API: https://developers.google.com/maps/documentation/javascript/get-api-key

Más información: https://developers.google.com/maps/documentation/javascript/usage?hl=en

El primer paso es crear un proyecto y luego escribir el nombre del proyecto.

Si quiero permitir todas las solicitudes de mydomain, entonces el patrón a seguir es * .joomunited.com / *
Si solo desea permitir un dominio único, por ejemplo mydomain.com, entonces el patrón sería joomunited.com/*

En un entorno localhost, puede poner cualquier clave válida y funcionará sin ninguna referencia de dominio.

Luego se genera la clave API, esta es la clave que necesita copiar para agregar a la My Maps location .

Agregue la clave a la My Maps Location .

Desde Componentes > My Maps Location > Vista de opciones , puede agregar una clave en la configuración.

Pega la llave.

Resumen paso a paso:

Entonces los pasos que sigo son

• Ir a la Consola API de Google
• Crea o selecciona un proyecto
• Haga clic en Continuar para habilitar la API y cualquier servicio relacionado.
• En la página Credenciales, obtenga una clave del navegador (y configure las credenciales de la API)
• Para evitar el robo de cuotas, asegure su clave de API siguiendo esas mejores prácticas

2. Gestionar categorías de ubicación

La ubicación se clasifica en categorías. Esas categorías pueden mostrarse como filtro en la interfaz o usarse como un parámetro predefinido en un elemento del menú para cargar algunas ubicaciones categorizadas.
 

Si tiene muchas ubicaciones, se recomienda utilizar categorías.
Puede crear categorías y subcategorías. Para crear una categoría, vaya a My Maps location > Categoría y haga clic en Nuevo

Luego, desde la pantalla de categoría, deberá agregar un título y una categoría principal en caso de que desee crear una subcategoría

También puede definir un marcador predeterminado para la ubicación en la categoría usando la pestaña Selección de marcador

3. Crea una ubicación

Para crear una ubicación, vaya a My Maps location > Ubicaciones > Nuevo

Hay 3 campos obligatorios:

• Nombre de la ubicación
• Categoría de la ubicación
• Detalles de ubicación (dirección)      

Para la dirección tienes 3 soluciones para agregarla:

• Use el campo de búsqueda (recomendado)
• Navega hacia el mapa y usa el cursor para señalar una ubicación
• Rellene una dirección (debe ser válida en Google Maps)

Para agregar una ubicación con el motor de búsqueda, escriba el nombre del lugar que desea agregar.

En la selección, los campos de latitud y longitud se completarán automáticamente. ¡Mis mapas también están integrados con Google Places! Significa que puede buscar una tienda o cualquier otra cosa que esté registrada en Google Maps, nuestro componente obtendrá toda la información del lugar.

También puede moverse en el mapa y colocar un marcador directamente, el resultado será el mismo y obtendrá una latitud y una longitud automáticamente.

Tenga cuidado con el campo de dirección y el código postal si lo completa manualmente, debe coincidir con una dirección conocida de Google Maps.

El resto de la información de la ubicación (descripción, horario, ...) se muestra en la vista detallada de la ubicación.

El enlace de contacto en la edición de detalles de ubicación es la posibilidad de agregar un enlace de contacto, mailto o URL por ubicación. En la interfaz, aparecerá un botón de contacto que abrirá la URL o ejecutará la acción mailto.

4. Otra información sobre la ubicación

En cada ubicación puede agregar una imagen y un marcador. 

• Imagen de la ubicación: la imagen se mostrará como una miniatura en la información sobre herramientas de la ubicación y en un tamaño más grande en la página de detalles de la ubicación.
• Usar ícono de categoría: use el ícono que colocó en el campo de categoría de las ubicaciones de mi mapa
• Fondo del marcador: elige el color para tu marcador de fondo
• El marcador se mostrará en el mapa como un icono de marcador de ubicación. También tienes algunos bonitos conjuntos de marcadores para tus ubicaciones incluidos en My Maps Location .
• Usar un enlace personalizado anulará el enlace al detalle de la ubicación mediante una URL personalizada.

My Maps location utiliza la función multilingüe nativa de Joomla. Puede definir un idioma en categorías de ubicación y en ubicaciones. Al cambiar de idioma, las ubicaciones se filtrarán como cualquier otro contenido de Joomla para mostrar el contenido aprobado en el idioma.

El campo de descripción de la ubicación es uno de los más importantes.
Se mostrará en la página de detalles de la ubicación y, según el tema, como texto de introducción de la ubicación en los resultados de búsqueda. Más importante aún, la descripción es un editor WYSIWYG con todos los complementos cargados en su interior, lo que significa que puedes hacer lo que quieras en él (imágenes, vídeos...).

Aquí está el texto de introducción que se muestra en los resultados de búsqueda de ubicación.

El campo de etiqueta es el mismo sistema de etiquetas que Joomla. Puede agregar etiquetas y subetiquetas y luego cargarlas en la interfaz como filtro. Para administrar todas las etiquetas, simplemente cargue el componente de etiquetas de Joomla: Componente de menú > Etiquetas
En la interfaz, según la configuración, las etiquetas se pueden mostrar como casillas de verificación (como a continuación) o como una lista desplegable.

My Maps Location tiene campos adicionales para completar la metainformación (para motores de búsqueda). Estos campos se cargan en la página de detalles de la ubicación.

5. Mostrar ubicaciones en la interfaz

Para mostrar sus ubicaciones en la interfaz de usuario, puede usar:

• Un menú para mostrar el motor de búsqueda de ubicación, ubicación única o categoría de ubicaciones
• Un módulo para mostrar un campo de búsqueda o seleccionar un conjunto de ubicaciones
• Un botón de editor para mostrar ubicaciones únicas o múltiples en cualquier editor

Cargar ubicaciones desde un menú

Desde el administrador de menús de Joomla, agregue un elemento y seleccione como tipo "Búsqueda y visualización de ubicación". Mostrará el motor de búsqueda de ubicación con filtros.
Seleccione "Vista detallada de la ubicación" para mostrar una única ubicación predefinida.

Desde la pestaña principal del menú puede configurar:

• Ingrese la dirección: puede forzar que se muestre una dirección predeterminada al cargar la página. Se puede dejar vacio
• Distancia: la distancia para bloquear la búsqueda, consultando la dirección anterior. Se puede dejar como -1 (predeterminado)
• Categoría: carga una categoría específica de ubicación
• Límite de búsqueda: limita el número de resultados de búsqueda. 10 solo devolverá los 10 primeros resultados en la búsqueda de ubicación
• Ordenar: ordenar los resultados de la búsqueda por fecha, título, distancia (predeterminado)

Luego, en la pestaña del menú My Maps Location , puede configurar:

• Seleccione el componente: My Maps Location o todas las integraciones de terceros como K2, Jomsocial ...
• ID de categoría predeterminada (extensiones de terceros): categoría predeterminada para cargar cuando se utiliza una extensión de terceros, como K2, Hikashop o Adsmanager, ID de lista CB para el constructor de comunidades
• Ubicaciones de categorías secundarias: muestra también como resultados de búsqueda ubicaciones de subcategorías, no solo la seleccionada arriba
• Tema: seleccione uno de los 3 temas predeterminados, ancho completo y barra lateral del tema de búsqueda y visualización de resultados disponibles para el elemento del menú
• Proveedor de mapas: seleccione Google Maps, Bing Maps, Mapbox, OpenStreetMap, Baidu o Mapquest para diseñar sus mapas
• Habilitar etiquetas de búsqueda : permite realizar consultas de búsqueda utilizando nombres de etiquetas de ubicación.
• Diseños: Dependiendo de la fuente del mapa tienes varios tipos y colores de mapas.
• Capa de mapa: agregue algunos datos (capa) a sus mapas. Hay una capa KML, una capa de tráfico, una capa de tránsito y una capa de ciclismo.
• URL de la capa de mapa de Google: utilice la capa de datos para almacenar sus datos personalizados o para mostrar datos GeoJSON en un mapa de Google.
• Tipo de Bing Maps: si Bing Maps es su proveedor de mapas, seleccione la apariencia y los datos de Bing Maps.
• Tipo de OpenStreetMap: si OpenStreetMap es su proveedor de mapas, entonces puede agregar algunos datos (capas) a sus mapas.
• Información sobre la ubicación: al cargar el mapa, abre automáticamente la información sobre la ubicación después de la búsqueda de ubicación
• Zoom del mapa: define un nivel de zoom predeterminado en el mapa
• Opciones de ancho y alto de mapa y resultados de búsqueda

Pantalla frontal según el tema

Resultado para una pantalla de búsqueda de ubicación única:

Mostrar ubicaciones utilizando un módulo

My maps location viene con 2 módulos para ubicaciones nativas + otro para integración de terceros (como un módulo para mostrar ubicaciones de elementos K2)

El módulo Mapa le permite mostrar sus ubicaciones con los mismos filtros que el menú pero en una posición de módulo. Las ubicaciones se mostrarán como Mapa o Lista. Puede seleccionar un conjunto de ubicaciones o seleccionar categorías de ubicación.

My Maps Location : el módulo de búsqueda mostrará un motor de búsqueda con algunos filtros como opción, como el ancho del mapa o el componente en el que se buscará la ubicación (busque la ubicación K2 solo para un ejemplo).

Módulo de visualización en la interfaz:

Mostrar ubicaciones con un botón de editor

El botón del editor se cargará en su editor de Joomla (generalmente en artículos o módulos HTML personalizados).
Verás el botón en la parte inferior de tu editor. Al hacer clic, verá un cuadro de luz que le permite seleccionar una o varias ubicaciones que haya agregado anteriormente.

Luego puede seleccionar una o alguna ubicación y presionar el botón para agregarla en su artículo.
Si no especifica ningún nivel de zoom, se cargará automáticamente para adaptarse a su área de ubicación. El código de la etiqueta que verá en su editor WYSIWYG será como este modelo: {mymaplocations mapid width height}

Ej: {mymaplocation id=1 width=58% height=400px zoom=10 type=google} este código mostrará un mapa con la ubicación ID=1, con 58% de ancho, 400px de alto, zoom de 10 veces y tipo de Google. Usar la coma para agregar más de una ubicación en un mapa. Por ejemplo: {mymaplocation id=1 ancho=58% alto=400px zoom=10 tipo=google} el ID de ubicación = 1, 2, 3.