Retour
Insérer une carte sur votre site web

Attention ! En insérant une carte Trace de Trail sur votre site web, vous vous engagez à ne masquer aucun élément du module (liens vers Trace de Trail ou bannière Trail Connect), que ce soit en utilisant l'iframe ou le widget.

Pour afficher votre trace sur votre site web, Trace de Trail vous met à disposition deux outils différents :
  • une page web que vous pourrez utiliser à l'intérieur d'une balise html iframe
  • un widget javascript qui vous permet de mieux maîtriser l'insertion sur votre site web
Pour récupérer le code à insérer sur votre site web, rendez-vous sur la page de votre trace.
aide
Pour récupérer code, vous devez vous rendre sur la page de la trace, puis ouvrir le bloc Plus d'outils. Choisissez alors le fond de carte que vous souhaitez afficher en fonction de la localisation de votre parcours.
Il vous faut également choisir la hauteur et la largeur du bloc iframe sur votre site web. Ces dimensions pourront être facilement modifiées dans le code que vous allez obtenir.
Il ne vous reste plus qu'à copier ce code pour le coller dans la page html de votre site web.

Pour utiliser certaines cartes, vous aurez besoin d'obtenur une clé d'accès. Pour cela rendez vous sur votre profil (Menu/Mes Infos) : vous y trouverez des tutoriels pour obtenir ces clés d'accès.

aide

Seules des pages spécifiques dont l'url est fourni par Trace de Trail peuvent être insérées sur votre site web dans une balise iframe. Vous ne pouvez pas charger une autre page du site (la page d'accueil ou la page de votre trace par exemple)

Vous pouvez modifier l'apparence de votre trace et de son profil depuis la page de votre trace et l'enregistrer (Plus d'outils/Sauvegarder le style de ma trace). Ainsi, ce style sera également utilisé pour l'affichage sur votre site web.

Cette option n'est accessible qu'aux abonnés Trailer Ultra (grand public) ou Premium + (professionnels). Elle permet de mieux gérer l'intégration de la carte Trace de Trail au sein de votre site web.
Vous devez pour cela ajouter deux éléments sur votre page web :
  • une balise script qui référence le fichier javascript situé sur le serveur de Trace de Trail
    <script src="https://tracedetrail.fr/assets/javascript3/mapTraceTdt.js" type="text/javascript"></script>
  • une balise qui contiendra le widget (habituellement une balise div) et référencée par l'identifiant "widgetTdt"
    <div id="widgetTdt" data-trace=63002 data-layer="osm" data-lang="fr" data-code=212328></div>
La balise div doit contenir plusieurs attributs : pour récupérer le code, le principe est le même que pour l'iframe.
Les attributs que doit contenir la balise div sont les suivants :
  • data-trace : il correspond au numéro de trace
  • data-layer : c'est le nom de la couche de cartes que vous souhaitez afficher
  • data-lang : fr ou en
  • data-code : c'est le code d'accès qui vous est personnel
  • data-key : ce paramètre est facultatif, il permet de fournir une clé d'accès aux cartes si nécessaire. Si cette clé n'est pas fournie mais qu'elle est nécessaire, le widget utilisera la clé spécifiée sur votre profil (Menu/Mes Infos)

Quand vous utilisez une balise iframe, c'est la page web de Trace de Trail qui appelle les cartes, tandis que si vous utilisez le widget, c'est votre site web. Pour l'accès aux cartes IGN, il faut donc spécifier l'adresse de votre site web pour la sécurisation de la clé.

Vous ne pouvez insérer qu'un seul widget par page web !

Identifiez-vous !

Mot de passe oublié ?
Vous possédez un compte avec une connexion Facebook ou Apple ? Utilisez la fonctionnalité "Mot de passe oublié" pour basculer sur un compte classique.
Créez un compte

OK
Annuler