Documentation My Maps location

introduction

Laissez vos utilisateurs rechercher des emplacements et configurer l'affichage à votre guise. My maps location est simplement l'intégration la plus avancée de Google Maps pour Joomla.

 

My-maps-location-main

 

Caractéristiques principales:

  • Rechercher les lieux que vous avez créés
  • Géolocalisation automatique
  • La source de la carte peut être Google Maps, Bing Maps ou Mapbox.
  • Ajouter une conception de carte
  • Obtenir des informations de Google lieux
  • Importer / exporter / synchroniser des emplacements à partir d'un fichier .csv
  • Soumission d'emplacement frontend
  • Beaucoup d'intégrations d'extensions tierces

I. INSTALLATION ET MISE À JOUR DE MY MAPS LOCATION

1.1 Installer

Notre composant est compatible avec Joomla 3.x. Toutes les fonctionnalités et les intégrations tierces sont incluses dans toutes les adhésions.
Pour installer notre composant, vous devez télécharger le fichier d'extension .zip et utiliser le programme d'installation Joomla standard.

 

joomla-install

 

Cliquez ensuite sur Parcourir> Bouton Télécharger et Installer, le composant, les modules et les plugins seront installés, activés par défaut.

1.2 Mise à jour et mise à jour automatique

Pour mettre à jour My Maps location, vous pouvez installer une nouvelle version par-dessus l’ancienne en téléchargeant le fichier ZIP de JoomUnited ou en utilisant le programme de mise à jour automatique (recommandé).

 

mml-update

 

Le programme de mise à jour automatique, qui envoie la notification de mise à jour, est intégré à l'extension Joomla que vous avez installée. Vous serez donc averti comme n'importe quelle autre extension du tableau de bord ou en utilisant le menu: Extension> Gérer> Menu de mise à jour.

 

Connectez-vous à votre compte pour mettre à jour

Vous devez vous connecter à votre compte JoomUnited pour mettre à jour toutes vos extensions JoomUnited Joomla. Pour vous connecter, accédez à la configuration principale du composant, puis cliquez sur le bouton Onglet mise à jour en direct. En bas, vous trouverez un bouton de connexion.

 

mise à jour en direct

 

Entrez vos identifiants JoomUnited, les mêmes que ceux que vous utilisez pour vous connecter ici @ www.joomunited.com

 

login-joomunited

 

Le bouton deviendra orange, félicitations! vous pouvez maintenant mettre à jour toutes les extensions JoomUnited sur ce site! Si votre adhésion est expirée, vous obtiendrez un lien de renouvellement et un texte expliquant cela.

 

lié au compte

 

Remarque: un seul identifiant vous permettra de mettre à jour toutes les extensions JoomUnited (en ce qui concerne votre adhésion). La connexion n'expire que si vous la déconnectez.

II. EMPLACEMENTS ET CATÉGORIES

2.1 Obtenir une clé d'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.
Obtenir une clé et activer l'API: https://developers.google.com/maps/documentation/javascript/get-api-key

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

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

 

create-api-key

 

Si je veux autoriser toutes les demandes de mydomain, le modèle à suivre est * .joomunited.com / *
Si vous souhaitez uniquement autoriser un seul domaine, par exemple, mydomain.com, le modèle est joomunited.com/*.


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

 

domaine-api-pattern


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

 

créé par api

 

Ajoutez la clé à My Maps Location.

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

 

cartes-configuration

 

Collez la clé.

 

add-api-key

 

Résumé étape par étape:


Donc, les étapes que je suis sont

  • Accédez à la console Google API.
  • Créer ou sélectionner un projet
  • Cliquer sur Continuer activer l'API et tous les services associés
  • Sur la page Références, obtenez un Touche navigateur (et définir les informations d'identification de l'API)
  • Pour éviter le vol de quota, sécurisez votre clé API à la suite ces meilleures pratiques

2.2 Gérer les catégories de lieu

Les lieux sont classés en catégories. Ces catégories peuvent être affichées en tant que filtre dans le frontal ou utilisées en tant que paramètre prédéfini dans un élément de menu pour charger des emplacements classés.
 

catégorie-filtre-frontend

 

Si vous avez beaucoup d'endroits, 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, veuillez vous rendre dans My Maps location> Catégorie et cliquez sur Nouveau

 

catégories-emplacements

 

Ensuite, à partir de l'écran des catégories, vous devrez ajouter un titre et une catégorie parent si vous souhaitez créer une sous-catégorie.

 

catégorie-parent

 

Vous pouvez également définir un marqueur par défaut pour l'emplacement dans la ctaegory à l'aide de l'onglet Sélection du marqueur

 

catégorie-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

2.3 Créer un emplacement

Pour créer un lieu, veuillez vous rendre dans My Maps location> Lieux> Nouveau

Il y a 3 champs obligatoires:

  • Nom du lieu
  • Catégorie de l'emplacement
  • Détails de localisation (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 indiquer une position.
  • Remplissez une adresse (Google Maps doit être valide)

 

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

 

Ajouter un emplacement

 

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

 

Google-place

 

 

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

 

carte-point

 

Faites attention au champ d'adresse et au code postal si vous le remplissez manuellement, il doit correspondre à une adresse connue de Google Maps.

 

champs d'adresse

 

Toutes les autres informations sur l'emplacement (description, heures, ...) sont affichées dans la vue détaillée de l'emplacement.

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, un bouton de contact ouvrira l'URL ou exécutera l'action mailto.

 

9

 

2.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 supérieure sur la page de détail de l'emplacement.
  • Utiliser l'icône de la catégorie: Utilisez l'icône que vous mettez dans le champ de catégorie de mes emplacements de carte
  • Fond de marqueur: choisissez la couleur de votre marqueur de fond
  • Marqueur sera affiché sur la carte en tant qu'icône de marqueur de position. Vous disposez également de jolis jeux 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.

 

marqueur-image-emplacement

 

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

 

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, en fonction du thème, en tant que texte d'introduction de l'emplacement dans les résultats de la 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 dedans (images, vidéos ...).

 

description de l'emplacement

 

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

 

résultats text-in-location

 

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

 

tag-filter

 

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.

 

Méta-information

 

2.5 Emplacements d'affichage sur le frontend

Pour 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

Charger des emplacements à partir d'un menu

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

 

menu de localisation

 

Si vous sélectionnez «Recherche et affichage de la position» vous avez des paramètres d'affichage. Certains peuvent remplacer les paramètres de composant par défaut.

 

menu-config

 

À partir de l'onglet principal du menu, vous pouvez configurer:

  • Entrer l'adresse: vous pouvez forcer l’affichage d’une adresse par défaut au 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é en tant que -1 (par défaut)
  • Catégorie: charger une catégorie de lieu spécifique
  • Limite de recherche: limiter le nombre de résultats de recherche. 10 ne renverront que les 10 premiers résultats sur la recherche de localisation
  • Commande: Résultats de la recherche par ordre par date, titre, distance (par défaut)

 

mml-menu-advanced

 

Puis sur le My Maps Location onglet de menu, vous pouvez configurer:

  • Sélectionner un 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, telle que K2, Hikashop ou Adsmanager, identifiant de liste CB pour le générateur de communauté
  • Emplacement des catégories d'enfants: Afficher également comme résultats de recherche des emplacements de 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 d'affichage de recherche et de résultat disponible pour l'élément de menu
  • Fournisseur de carte: Sélectionnez Google Maps, Bing Maps, Mapbox, OpenStreetMap ou Mapquest pour créer un style pour vos cartes.
  • Activer les balises de recherche: Permet d'effectuer des requêtes de recherche à l'aide de noms de balises d'emplacement
  • Dessins: En fonction de la source de la carte, vous avez plusieurs types et couleurs de carte.
  • Couche de la 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 bicyclette.
  • URL du calque Google Map: Utilisez la couche Données pour stocker vos données personnalisées ou pour afficher des données GeoJSON sur une carte Google.
  • Type de Bing Maps: Si Bing Maps est votre fournisseur de carte, sélectionnez l'apparence et les données de Bing Maps.
  • Type OpenStreetMap: Si OpenStreetMap est votre fournisseur de carte, vous pouvez alors ajouter des données (couche) à vos cartes.
  • Info-bulle d'emplacement: Lors du chargement de la carte, l’ouverture automatique de l’info-bulle de lieu après la recherche
  • Zoom de la carte: Définir un niveau de zoom par défaut sur la carte
  • Options de largeur et de hauteur des résultats de carte et de recherche

 

Affichage frontend basé sur le thème

 

carte-recherche-thèmes

 

Résultat pour un affichage de recherche d'emplacement unique:

bridgewater-location


Afficher les emplacements à l'aide d'un module

My maps location est livré avec 2 modules pour les emplacements natifs + autres 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'emplacement.

 

module de carte

 

My Maps Location Map - Module de recherche affichera un moteur de recherche avec certains filtres en option, comme la largeur de la carte ou le composant dans lequel la localisation sera recherchée (recherche de la position K2 uniquement pour axample).

 

module de recherche

 

Module d'affichage sur le frontend:

 

modules de recherche-carte-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 HTML personnalisés). Vous verrez le bouton au bas de votre éditeur.
Au clic, vous verrez une boîte à lumière vous permettant de sélectionner un ou plusieurs emplacements que vous avez ajoutés auparavant.

 

carte-éditeur-bouton

 

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, celui-ci sera automatiquement chargé pour s’adapter à votre zone géographique.
Le code de balise que vous verrez dans votre éditeur WYSIWYG ressemblera à ce modèle: {mymaplocations mapid width width}

Ex: {mymaplocation id = 1 width = 58% height = 400px zoom = 10 type = google} ce code affichera une carte avec l'ID de localisation = 1, avec 58% width, 400px height, 10 fois le zoom et le 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 de localisation = 1, 2, 3.

 

III. SOUMISSION LIEU FRONTEND

3.1 Ajouter et gérer des emplacements

My maps location offre la possibilité de soumettre et de gérer vos propres emplacements depuis le frontend. Tout d'abord, vous devrez créer un menu permettant la soumission frontale.

Dans le gestionnaire de menus Joomla, ajoutez un élément et sélectionnez comme type "Ajouter des lieux". Ensuite, en cliquant dessus, les utilisateurs seront redirigés, après la connexion, vers un formulaire de soumission d'emplacement.
Le menu "Mes localisations" permet à l'utilisateur de modifier les localisations précédemment soumises.

 

add-manage-location-frontend

 

Vue d'ensemble du formulaire de menu:

 

menu avant

 

3.2 Limitation d'accès

Le processus de soumission et d’édition du client est contrôlé par Joomla ACL. Pour éditer qui est autorisé à soumettre et éditer un lieu, cliquez sur Composants> My Maps Location> Options> Autorisations.
A partir de là, vous pouvez contrôler le groupe d'utilisateurs Joomla qui est capable de:

  • Créer des emplacements
  • Supprimer des lieux
  • Modifier les lieux
  • Modifier l'état de la publication
  • Éditer ses propres lieux

 

Frontend-location-soumission

 

IV IMPORTATION - LIEUX D'EXPORTATION

My Maps location a obtenu un outil d'importation, d'exportation et de synchronisation pour le localiser à partir d'un fichier .csv ou .kml (fichier Google Earth). Clique sur le menu My Maps Location> Importer / Exporter pour accéder à l'interface.

 

outil d'import-export

 

A partir de cette interface, vous pouvez:

  • Importer des emplacements à partir d'un fichier .csv ou .kml
  • Exporter des emplacements à partir d'un fichier .csv ou .kml
  • Effectuer une mise à jour (synchronisation) des emplacements à partir d'un fichier .csv ou .kml

 

Remarque: le bouton de synchronisation fonctionne également lorsque vous avez ajouté un emplacement directement dans la base de données.

V. STATISTIQUES DE RECHERCHE

Vous pouvez afficher les statistiques de votre recherche d'emplacement en activant le paramètre Activer les statistiques à l'adresse Paramètres> onglet Configuration générale.

 

mois statistiques

 

Et vous pouvez voir la liste des meilleurs endroits ci-dessous, vous pouvez Exportation avec le type de fichier .csv aussi.

 

statistiques d'exportation

 

VI. PARAMÈTRES

6.1 Paramètres

Le composant a beaucoup d'options, certaines peuvent être remplacées dans la vue du menu, comme nous l'avons vu précédemment. Clique sur le menu: My Maps Location> Options pour accéder à l'interface (en haut à droite de l'écran)

Tab1: Configuration générale

 

Parameters1

 

  • Activer les statistiques: Activer les statistiques d'emplacement
  • Recherche AJAX: Activer les requêtes de recherche dans AJAX, effectuer une recherche sans recharger la page
  • Distance d'affichage: Afficher la distance de l'emplacement à la position de l'utilisateur
  • Unité de distance: Miles ou kilomètres
  • Fournisseur de carte: choisir entre Google maps, Microsoft Bing maps, Mapbox, Openstreetmap + Leaflet ou Mapquest
  • Recherche de saisie semi-automatique: Suggestions de saisie semi-automatique lorsque vous effectuez une recherche d'emplacement. Les suggestions de saisie semi-automatique peuvent provenir de Google Maps, Bing Maps ou Openstreetmap, quel que soit le système de carte que vous avez choisi.
  • 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.
    Plus d'information: https://developers.google.com/maps/documentation/javascript/usage?hl=fr
    Obtenez une clé: https://developers.google.com/maps/documentation/javascript/get-api-key
  • Type de Google Maps: type de carte: carte routière, satellite, hybride ou terrain
  • Conception de la carte: Sélectionnez un modèle par défaut pour vos cartes.
  • Faites défiler la carte de la souris: Activer le zoom avant / arrière en utilisant la souris lorsque vous survolez la carte
  • Drag map: Activer pour faire glisser la carte pour la déplacer, en utilisant la souris
  • Marqueur d'événement ouvert: Comment les détails de l'emplacement sont ouverts lorsque vous cliquez ou survolez un marqueur
  • Activer le clustereur de marqueurs: Chaque grappe comportant plusieurs marqueurs indique le nombre de marqueurs à l'intérieur de la grappe.
  • Fonction de zoom automatique: ajuste automatiquement le zoom pour afficher tous les marqueurs de la carte
  • Type de Bing Maps: type de carte: aérienne, à vol d'oiseau ou sur route
  • Clé de l'API Bing Maps: mettre une clé API pour le faire fonctionner;)

 

Parameters2

 

  • Recherche n'importe où: ajoutez l'option dans la recherche de rayon pour chercher n'importe où dans le monde
  • Rechercher n'importe où par défaut: par défaut, le sélecteur de rayon dans la vue de recherche sera défini sur Partout
  • Format de balise dans la recherche: afficher les filtres de balises sous forme de case à cocher ou de liste déroulante
  • Street view: Ajouter une vue de la rue dans la recherche en tant qu'option
  • Afficher l'itinéraire: Afficher un lien pour calculer l'itinéraire à partir de la position de l'utilisateur
  • Format de la route: afficher l'itinéraire sur My Maps location ou rediriger vers Google
  • Lien de contact à l'emplacement: Ajouter un lien vers une page de contact
  • Bouton de contact: afficher le bouton de contact
  • Cible du lien de contact: Ouvrir le mode lien de contact
  • Zoom par défaut de la carte: Niveau de zoom par défaut sur la carte lors du premier chargement (régler le zoom automatique sur non)
  • Taille de la carte: carte et résultats de recherche largeur et hauteur
  • Distance pour la recherche de rayon: déterminer les valeurs de la liste déroulante de recherche de rayon
    Ex. L'utilisateur peut choisir de rechercher 10 miles autour de la ville de New-York.
  • Afficher la liste de sélection de distance: option pour afficher la liste de sélection de recherche de distance

 

Parameters3

 

  • Word crop dans les résultats de recherche: rogner la description de l'emplacement à un certain nombre de mots dans les résultats de recherche
  • Encadré JQuery: changer la barre latérale par défaut en une barre JQuery (effet de défilement plus petit et lisse)
  • Désactiver la géolocalisation: désactiver la géolocalisation sur un site non https.
  • Désactiver le filtre de catégorie: cette option activera le filtre de liste déroulante de catégories
  • Désactiver le filtre d'état de pays: afficher un menu déroulant de pays dans la vue de recherche
  • Recherche par code postal: Champ de recherche par code postal
  • Couleur pour le bouton OU: Couleur du bouton «OU» sur le thème par défaut
  • Couleur du bouton: Couleur du bouton "Géolocaliser" sur le thème par défaut
  • Couleur de police globale: Utilisez cette option pour définir la couleur de police globale des emplacements de Mes cartes.
  • Image de fond: image en arrière-plan de la recherche sur le thème par défaut
  • Vous marqueur: ajoutez votre position sur la carte et sélectionnez une image comme marqueur
  • Image de l'icône par défaut: utiliser l'image d'icône par défaut si l'icône n'est pas disponible
  • Helper Override: générer un fichier de remplacement de mise en page standard Joomla qui ne sera pas affecté par les mises à jour d'extension (dossier / html)

 

6.2 Bing en tant que source cartographique

Pour utiliser Bing Maps de Microsoft en tant que source de carte, vous devez renseigner une clé API dans la configuration globale de My Maps location. La page Bing est ici: https://www.bingmapsportal.com/

 

global-bing

 

Vous devez créer un compte gratuit à partir d'ici et copier le code de la clé d'API à partir de votre compte.

 

bing-key-microsoft

 

Vous pourrez ensuite utiliser Bing Map comme source de map à partir de la configuration globale (pour l'activer par défaut) ou à partir de l'élément de menu.

 

Bing-config

 

6.3 Mapbox en tant que source cartographique

Pour utiliser Mapbox, la plate-forme de mappage personnalisée pour les développeurs, vous devez remplir une API Mapbox dans le répertoire source. Configuration My Maps location> Fournisseurs de carte.
La page d'accueil Mapbox est ici, vous devez créer un compte gratuit à partir de là: https://www.mapbox.com/

 

mapbox-home

 

À partir de là, vous pouvez créer une nouvelle conception de page ou utiliser celle recommandée et la stocker sur votre compte.

 

style de carte

 

Pour obtenir vos identifiants, utilisez le compte de menu (en haut à droite):

  • API Mapbox: utilisez le menu Compte> Jetons d'accès

Vous obtenez donc une clé par style de carte que vous avez créé.

 

mapbox-apikey

 

Il suffit ensuite de le copier dans la configuration My Maps location pour l’utiliser.

 

mapbox-config