My Maps location : emplacements et catégories

1. Obtenez une clé API Google Maps

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 veux autoriser toutes les demandes de mydomain, alors le modèle à suivre est * .joomunited.com / *
Si vous voulez simplement autoriser un seul domaine par exemple mydomain.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 quota, sécurisez votre clé API en suivant ces bonnes pratiques

2. Gérer les catégories de lieux

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 à l'aide de l'onglet Sélection des marqueurs

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 solution 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 de détail d'emplacement, est la possibilité d'ajouter un lien de contact, mailto ou 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 à une taille plus grande sur la page de détails de l'emplacement.
Utiliser l'icône de catégorie: utilisez l'icône que vous mettez dans le champ de catégorie de mes emplacements sur la carte
Arrière-plan 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 position. Vous avez également de jolis ensembles de marqueurs pour vos emplacements inclus dans l' extension 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 fonction multilingue native de Joomla. Vous pouvez définir une langue dans des catégories d'emplacement et dans des emplacements. Lors du changement de langue, les emplacements seront filtrés comme tout autre contenu Joomla afin d'afficher le contenu approuvé dans 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 tout le plugin chargé à l'intérieur, cela signifie que vous pouvez 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 lors du chargement de la page. Il peut être laissé vide
Distance: la distance pour verrouiller la recherche, en se référant à l'adresse ci-dessus. Il peut être laissé à -1 (par défaut)
Catégorie: charger une catégorie spécifique d'emplacement
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
Classement: classer les résultats de la recherche par date, titre, distance (par défaut)

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

Sélectionnez le composant : My Maps Location ou toutes les intégrations tierces 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 constructeur de communauté
Emplacements des catégories enfants: affichez également les emplacements des résultats de recherche à partir des sous-catégories, pas seulement celle sélectionnée 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 disponible pour l'élément de menu
Fournisseur de carte: 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
Modèles: 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 transport en commun 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 des 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 d'OpenStreetMap: si OpenStreetMap est votre fournisseur de cartes, vous pouvez ajouter des données (couche) à vos cartes
Info-bulle d'emplacement: lors du chargement de la carte, ouvrez automatiquement l'info-bulle d'emplacement après la recherche d'emplacement
Zoom de la carte: définissez 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.