Intégrer des parcours OpenRunner sur votre site web permet d’enrichir l’expérience utilisateur en offrant à vos visiteurs la possibilité de découvrir et de télécharger des itinéraires directement depuis votre site. Cela rend l’accès à l’information plus fluide et engageant. Voici comment procéder et les différentes options d’intégration disponibles.
Vous souhaitez afficher plusieurs parcours sur une même page ? Vous pouvez également intégrer une Collection OpenRunner à votre site web afin de regrouper plusieurs itinéraires dans une seule intégration.
Étapes pour intégrer un parcours sur votre site internet
- Accéder à la fiche parcours : Rendez-vous sur la fiche de détail du parcours que vous souhaitez intégrer.
-
Cliquer sur l’option de partage
- Sélectionner "Intégrer le parcours à un site" : Choisissez cette option pour obtenir le code d’intégration. assurez-vous que le parcours est public pour que les options d’intégration soient accessibles. Vous pouvez modifier la visibilité du parcours si nécessaire.
- Copier le code d’intégration : Ccopiez le code d’intégration fourni et collez-le dans le code source de votre site internet.
Options d’intégration
Vous disposez de trois options pour intégrer un parcours sur votre site :
1. Intégration du parcours seul
- Description : Seule la carte du parcours est affichée, offrant une vue claire et immersive, , avec la possibilité de zoomer et de se déplacer.
- Responsive : La carte s’adapte à la taille de l’écran, occupant toute la zone dédiée.
- Lien vers OpenRunner : En cliquant sur le lien "Accédez au détail du parcours" en bas à droite, les utilisateurs sont redirigés vers OpenRunner pour voir toutes les caractéristiques du parcours (avis, photos, description, etc).
2. Intégration du parcours avec profil altimétrique
- Description : Ce format inclut à la fois la carte du parcours et son profil altimétrique.
- Dimensions : La fenêtre d’affichage mesure 500 x 650 pixels.
- Responsive : Comme pour l’option 1, le contenu s’adapte à la taille de l’écran.
- Lien vers OpenRunner : Le lien "Accédez au détail du parcours" redirige également vers la fiche complète du parcours sur OpenRunner.
3. Intégration du profil altimétrique seul
- Description : Cette option affiche uniquement le profil altimétrique du parcours.
- Responsive : Le contenu est conçu pour s’ajuster à différents écrans.
- Lien vers OpenRunner : En cliquant sur le lien "Accédez au détail du parcours", les utilisateurs sont renvoyés sur OpenRunner pour des informations supplémentaires.
Visualiser un parcours en 3D avec Flyover
Flyover permet à vos visiteurs de découvrir un parcours intégré sous la forme d’un survol 3D directement depuis votre site web.
Depuis l’intégration du parcours, cliquez sur « Démarrer » pour lancer la visualisation. La vue suit automatiquement la trace du point de départ jusqu’à l’arrivée et permet de mieux visualiser le relief, les montées, les descentes et l’environnement traversé.
Pendant le survol, la distance et l’altitude restent affichées. La vitesse de lecture peut également être modifiée pour parcourir rapidement l’ensemble de l’itinéraire ou observer plus précisément certains secteurs.
Flyover est particulièrement utile pour présenter le parcours d’une course, préparer une sortie ou donner aux visiteurs un aperçu plus concret de l’itinéraire avant de partir.
À retenir
L’intégration OpenRunner vous permet d’afficher un parcours directement sur votre site web sous plusieurs formats : carte seule, carte avec profil altimétrique ou profil altimétrique seul. Avec Flyover, vos visiteurs peuvent également découvrir le parcours et son relief grâce à une visualisation 3D dynamique.
Si vous souhaitez présenter plusieurs itinéraires au même endroit, utilisez plutôt l’intégration d’une Collection OpenRunner, qui permet de regrouper plusieurs parcours dans une seule intégration.
