My Maps location : emplacements et catégories

1. Obtenez une clé API Google Maps

A chaque fois que vous utilisez les API Google Maps, si votre domaine a été créé après le 22 juin 2016, vous devez inclure une clé, pour valider votre demande.
Obtenez une clé et activez l'API : https://developers.google.com/maps/documentation/javascript/get-api-key

Plus d'informations : https://developers.google.com/maps/documentation/javascript/usage?hl=en

La première étape consiste à créer un projet, puis à taper le nom du projet.

Si je souhaite autoriser toutes les demandes de mon domaine, le modèle à suivre est *.joomunited.com/*
Si vous souhaitez simplement autoriser un seul domaine, par exemple mondomaine.com, le modèle serait joomunited.com/*

Sur un environnement localhost, vous pouvez mettre n'importe quelle clé valide et cela fonctionnera sans référence de domaine.

La clé API est alors générée, c'est la clé que vous devez copier pour l'ajouter à l' My Maps location .

Ajoutez la clé à l' My Maps Location .

Dans la Composants > My Maps Location > Option , vous pouvez ajouter une clé dans la configuration.

Collez la clé.

CV étape par étape:

Les étapes que je suis sont donc

Accédez à la console API Google
Créer ou sélectionner un projet
Cliquez sur Continuer pour activer l'API et tous les services associés
Sur la page Informations d'identification, obtenez une clé de navigateur (et définissez les informations d'identification de l'API)
Pour éviter le vol de quotas, sécurisez votre clé API en suivant ces bonnes pratiques

2. Gérer les catégories de localisation

Les emplacements sont classés en catégories. Ces catégories peuvent être affichées sous forme de filtre dans l'interface ou utilisées comme paramètre prédéfini dans un élément de menu pour charger certains emplacements classés.

Si vous avez beaucoup d'emplacements, il est recommandé d'utiliser des catégories.
Vous pouvez créer des catégories et des sous-catégories. Pour créer une catégorie, rendez-vous dans My Maps location > Category et cliquez sur New

Ensuite, à partir de l'écran des catégories, vous devrez ajouter un titre et une catégorie parent au cas où vous souhaiteriez créer une sous-catégorie

Vous pouvez également définir un marqueur par défaut pour l'emplacement dans la catégorie en utilisant l'onglet Sélection du marqueur.

Remarque : une catégorie est créée par défaut nommée "Ma catégorie" vous permettant de commencer à ajouter des emplacements directement après l'installation

3. Créez un emplacement

Pour créer un lieu, veuillez vous rendre dans My Maps location > Locations > New

Il y a 3 champs obligatoires:

Nom du lieu
Catégorie de l'emplacement
Détails de l'emplacement (adresse)

Pour l'adresse vous avez 3 solutions pour l'ajouter :

Utilisez le champ de recherche (recommandé)
Naviguez sur la carte et utilisez le curseur pour pointer un emplacement
Remplissez une adresse (doit être valide pour Google Maps)

Pour ajouter un lieu avec le moteur de recherche, tapez le nom du lieu que vous souhaitez ajouter.

Lors de la sélection, les champs de latitude et de longitude seront remplis automatiquement. Mes cartes sont également intégrées à Google Places! Cela signifie que vous pouvez rechercher une boutique ou tout autre élément enregistré sur Google Maps, notre composant obtiendra toutes les informations sur le lieu.

Vous pouvez également vous déplacer sur la carte et mettre un marqueur directement, le résultat sera le même et vous obtiendrez automatiquement une latitude et une longitude.

Soyez prudent avec le champ d'adresse et le code postal si vous le remplissez manuellement, il doit correspondre à une adresse connue de Google Maps.

Toutes les autres informations du lieu (description, horaires,...) sont affichées dans la vue détaillée du lieu.

Le lien de contact dans l'édition détaillée de l'emplacement, est la possibilité d'ajouter un lien de contact, un mailto ou une URL par emplacement. Sur le frontend, il y aura un bouton de contact qui ouvrira l'URL ou exécutera l'action mailto.

4. Autres informations de localisation

Sur chaque emplacement vous pouvez ajouter une image et un marqueur.

Image de l'emplacement : l'image sera affichée sous forme de vignette dans l'info-bulle de l'emplacement et en plus grande taille sur la page de détail de l'emplacement.
Utiliser l'icône de catégorie : utilisez l'icône que vous avez placée dans le champ de catégorie des emplacements de ma carte.
Fond du marqueur : choisissez la couleur de votre marqueur d'arrière-plan
Le marqueur sera affiché sur la carte sous forme d'icône de marqueur de localisation. Vous avez également de jolis ensembles de marqueurs pour vos emplacements inclus dans My Maps Location .
Utiliser un lien personnalisé remplacera le lien vers le détail de l'emplacement par une URL personnalisée.

My Maps location utilise la fonctionnalité multilingue native de Joomla. Vous pouvez définir une langue en catégories de localisation et en localisations. Lors du changement de langue, les emplacements seront filtrés comme tout autre contenu Joomla afin d'afficher le contenu approuvé par la langue.

Le champ de description de l’emplacement est l’un des plus importants.
Il sera affiché sur la page de détail de l'emplacement et, selon le thème, sous forme de texte d'introduction de l'emplacement dans les résultats de recherche. Plus important encore, la description est un éditeur WYSIWYG avec tous les plugins chargés à l'intérieur, cela signifie que vous pouvez y mettre tout ce que vous voulez (images, vidéos...).

Voici le texte d'introduction affiché dans les résultats de la recherche de position.

Le champ de balise est le même système de balises que Joomla. Vous pouvez ajouter des balises et des sous-balises, puis les charger dans le frontend en tant que filtre. Pour gérer toutes les balises, il suffit de charger le composant de balise Joomla : Composant de menu > Balises
Sur le frontend, selon la configuration, les balises peuvent être affichées sous forme de case à cocher (comme ci-dessous) ou sous forme de liste déroulante.

My Maps Location a des champs supplémentaires pour remplir les méta-informations (pour les moteurs de recherche). Ces champs sont chargés sur la page de détail de l'emplacement.

5. Afficher les emplacements sur le frontend

Afin d'afficher vos emplacements sur le frontend, vous pouvez utiliser :

Un menu pour afficher le moteur de recherche d'emplacement, un emplacement unique ou une catégorie d'emplacements
Un module pour afficher un champ de recherche ou sélectionner un ensemble d'emplacements
Un bouton d'éditeur pour afficher un ou plusieurs emplacements dans n'importe quel éditeur

Dans le gestionnaire de menu Joomla, ajoutez un élément et sélectionnez comme type "Recherche et affichage d'emplacement". Il affichera le moteur de recherche de localisation avec des filtres.
Sélectionnez « Vue détaillée de l'emplacement » pour afficher un seul emplacement prédéfini.

Si vous sélectionnez "Recherche et affichage de lieu" , vous disposez de certains paramètres d'affichage. Certains peuvent remplacer les paramètres de composant par défaut.

Depuis l'onglet principal du menu, vous pouvez configurer :

Saisir l'adresse : vous pouvez forcer l'affichage d'une adresse par défaut au chargement de la page. On peut le laisser vide
Distance : la distance à parcourir pour verrouiller la recherche, en faisant référence à l'adresse ci-dessus. Il peut être laissé à -1 (par défaut)
Catégorie : charger une catégorie spécifique de lieu
Limite de recherche: limite le nombre de résultats de recherche. 10 ne renverra que les 10 premiers résultats lors de la recherche d'emplacement
Tri : trier les résultats de recherche par date, titre, distance (par défaut)

Ensuite, dans l' onglet de menu My Maps Location , vous pouvez configurer :

Sélectionnez le composant : My Maps Location ou toute intégration tierce comme K2, Jomsocial ...
ID de catégorie par défaut (extensions tierces) : catégorie par défaut à charger lorsqu'une extension tierce est utilisée, comme K2, Hikashop ou Adsmanager, ID de liste CB pour le créateur de communauté
Emplacements des catégories enfants : afficher également les emplacements des résultats de recherche des sous-catégories, pas seulement celui sélectionné ci-dessus.
Thème : sélectionnez l'un des 3 thèmes par défaut, pleine largeur et barre latérale du thème de recherche et d'affichage des résultats disponibles pour l'élément de menu.
Fournisseur de cartes : sélectionnez Google Maps, Bing Maps, Mapbox, OpenStreetMap, Baidu ou Mapquest pour styliser vos cartes.
Activer les balises de recherche : permet d'effectuer des requêtes de recherche à l'aide de noms de balises d'emplacement
Conceptions : en fonction de la source de la carte, vous disposez de plusieurs types et couleurs de carte.
Couche de carte : ajoutez des données (couche) à vos cartes. Il existe une couche KML, une couche de trafic, une couche de transit et une couche de vélo.
Url de la couche Google Map : utilisez la couche de données pour stocker vos données personnalisées ou pour afficher les données GeoJSON sur une carte Google.
Type Bing Maps : si Bing Maps est votre fournisseur de cartes, sélectionnez l'apparence et les données de Bing Maps.
Type OpenStreetMap : si OpenStreetMap est votre fournisseur de cartes, vous pouvez alors ajouter des données (couche) à vos cartes
Info-bulle de localisation : lors du chargement de la carte, ouvrez automatiquement l'info-bulle de localisation après la recherche de localisation.
Zoom sur la carte : définir un niveau de zoom par défaut sur la carte
Options de largeur et de hauteur de la carte et des résultats de recherche

Affichage frontal basé sur le thème

Résultat pour un affichage de recherche de lieu unique:

Afficher les emplacements à l'aide d'un module

My maps location est livré avec 2 modules pour les emplacements natifs + un autre pour l'intégration tierce (comme un module pour afficher les emplacements des éléments K2)

Le module Carte vous permet d'afficher vos emplacements avec les mêmes filtres que le menu mais dans une position de module. Les emplacements seront affichés sous forme de carte ou de liste. Vous pouvez sélectionner un ensemble d'emplacements ou sélectionner des catégories d'emplacements.

My Maps Location Map - Le module de recherche affichera un moteur de recherche avec certains filtres en option comme la largeur de la carte ou le composant dans lequel l'emplacement sera recherché (recherche de l'emplacement K2 uniquement pour un exemple).

Module d'affichage en frontend:

Afficher les emplacements à l'aide d'un bouton d'éditeur

Le bouton de l'éditeur sera chargé dans votre éditeur Joomla (généralement dans des articles ou des modules personnalisés HTML).
Vous verrez le bouton en bas de votre éditeur. En cliquant, vous verrez une lightbox qui vous permet de sélectionner un ou plusieurs emplacements que vous avez ajoutés auparavant.

Ensuite, vous pouvez sélectionner un ou plusieurs emplacements et appuyer sur le bouton pour l'ajouter à votre article.
Si vous ne spécifiez aucun niveau de zoom, il sera automatiquement chargé pour s'adapter à votre zone de localisation. Le code de balise que vous verrez dans votre éditeur WYSIWYG ressemblera à ce modèle : {mymaplocations mapid width height}

Ex: {mymaplocation id = 1 width = 58% height = 400px zoom = 10 type = google} ce code affichera une carte avec l'ID d'emplacement = 1, avec 58% de largeur, 400px hauteur, 10 fois le zoom et type Google. Utilisation de la virgule pour ajouter plusieurs emplacements sur une carte. Ex: {mymaplocation id = 1 width = 58% height = 400px zoom = 10 type = google} l'ID d'emplacement = 1, 2, 3.