Tutoriel expliquant pas-à-pas l'utilisation de MapChannels pour rendre une carte personnalisée "Google Maps" un peu plus interactive (moteur de recherche parmi les points sur la carte, mise en forme de la carte, etc).

1. Créer une carte interactive avec MapChannels TUTORIEL Le SAV du club Affaires courantes © Nicolas Monseigne

2. TUTORIEL Le SAV du club Affaires courantes En indiquant notre recherche (ici "Pauillac"), le moteur de recherche filtre les points de la carte, et le bon marqueur est mis en valeur : Voici ce que l'on aura in fine © Nicolas Monseigne

3. TUTORIEL Le SAV du club Affaires courantes Rendez-vous sur le site mapchannels.com… et bien sûr il faut se créer un compte… Ah oui… Your English is fluent, isn't it ? Car ici, tout est en anglais… La procédure… © Nicolas Monseigne

4. TUTORIEL Le SAV du club Affaires courantes Ceci fait, nous allons donc commencer notre carte… Cliquez sur "Map Channels version 2", puis, sur la page suivante "Create new map channel" La procédure… © Nicolas Monseigne

5. TUTORIEL Le SAV du club Affaires courantes 2 informations à donner : le lien de la carte Google Maps et un nom pour notre carte MapChannels La procédure… © Nicolas Monseigne

6. TUTORIEL Le SAV du club Affaires courantes 2 informations à donner : le lien de la carte Google Maps et un nom pour notre carte MapChannels La procédure… © Nicolas Monseigne

7. TUTORIEL Le SAV du club Affaires courantes Pour récupérer le lien de la carte Google Maps, rendez-vous donc sur maps.google.com. Dans la partie "Mes Cartes", sélectionnez celle qui vous intéresse La procédure… © Nicolas Monseigne

8. TUTORIEL Le SAV du club Affaires courantes En haut à droite, cliquez sur "Lien", puis copiez l'adresse web de votre carte… La procédure… © Nicolas Monseigne

9. TUTORIEL Le SAV du club Affaires courantes … puis collez-la sur MapChannels. La procédure… Ajoutez votre titre de carte (sans espace, ni caractère spécial) Et enfin, cochez la case et créez ! © Nicolas Monseigne

10. TUTORIEL Le SAV du club Affaires courantes Sur la page qui s'affiche en suivant, on vous propose : La procédure… - Map Preview : la carte telle qu'elle existe actuellement. Elle est moche, normal, on ne l'a pas encore mise en forme ;-) - Map script : il s'agit du code qu'il faudra coller dans votre site web pour intégrer votre carte - Help support Map Channels : un lien hypertexte à mettre sur votre site pour remercier Map Channels de vous mettre à disposition cet outil - Full screen link : il s'agit d'un lien hypertexte à insérer près de votre carte, offrant à votre internaute la possibilité de voire votre belle carte en plein écran - Edit your map channel settings : les encadrés suivants permettent de mettre en forme votre carte (et l'embellir !). Le bouton "Update" permet de rafraichir les informations dès que vous touchez un paramètre © Nicolas Monseigne

11. TUTORIEL Le SAV du club Affaires courantes EDIT YOUR MAP SETTINGS… La procédure… - Map data source : pas besoin de cocher la case sur la première mise en forme. - Script settings : cochez la case, pour un rafraîchissement quotidien automatique des informations. - Channel information : cochez la première case si elle n'a rien de secret ! Ensuite, modifiez les quelques informations dans les menus déroulants : - "Map classification", mettre "Travel" - "Language" : French - "Country" : France - Mais surtout vos URL de sites internet, blogs, etc © Nicolas Monseigne

12. TUTORIEL Le SAV du club Affaires courantes EDIT YOUR MAP SETTINGS… La procédure… - Map functionality : pas besoin de changer grand-chose ici. Le seul vrai critère à regarder de près est "Initial Map type" : - "road map" = vue du réseau routier - "satellit" = vue satellitaire - "hybrid" = réseau routier + vue satellitaire - terrain et relief a priori ne nous concernent pas vraiment © Nicolas Monseigne

13. - Style settings : ici, on peut personnaliser beaucoup de choses ! Largeur (Width) et hauteur de la carte à afficher sur votre site web Couleur et épaisseur de la bordure de la carte (mettre "0" pour ne pas avoir de bordure) Ici se règlent les couleurs de la carte : Main Fore Color = couleur des textes Main Back color = couleur du fond Header => pas besoin de changer Highlight => couleur de police et trame quand on sélectionne un point Ici se règlent les tailles de police sur les titres et textes de la carte Largeur de la barre latérale © Nicolas Monseigne

14. - Presentation settings Paramétrage de la barre latérale dans laquelle se trouve le moteur de recherche Paramétrage des bulles d'infos dans la carte Faites vos essais de réglages, cliquez sur "Update", et contrôlez que le résultat vous convient ! © Nicolas Monseigne

15. Une fois tous les paramétrages faits, il suffit de copier ce code (situé en haut de la page) et de le coller sur son site web ! Le SAV du club Affaires courantes © Nicolas Monseigne

16. TUTORIEL Le SAV du club Affaires courantes Créer une carte de photos La procédure… Fin du tutoriel © Nicolas Monseigne