Créer un widget avec tracés GPS

STUDIO WIDGETS · TUTO

Depuis mars 2026, le Studio Widgets vous permet d'afficher les itinéraires et randonnées renseignés avec une trace GPX dans Apidae sur la carte du widget. Idéal pour valoriser vos offres outdoor.

Ce tuto vous guide pas à pas : de la création de la sélection dans votre projet jusqu'à l'intégration du widget sur votre site.

À retenir

Utilisez le template Liste + Carte : c'est lui qui affiche le tracé de l'itinéraire sur la carte.

Le tracé ne s'affiche que si la fiche contient un fichier GPX typé Plan et tracé GPS dans l'onglet Multimédias.

Un widget outdoor clé en main

L'internaute consulte la liste des itinéraires à gauche et la carte à droite. Au clic sur un itinéraire, son tracé s'affiche sur la carte, avec un lien Voir le détail vers la fiche complète.

Il peut aussi affiner les résultats grâce aux filtres : durée, distance, équipements…

Voici un exemple de widgets avec des itinéraires de randonnées :

Prérequis

Avant de commencer, vérifiez les trois points suivants.

PROFIL

Utilisateur membre

Vous êtes connecté à Apidae avec un profil "utilisateur membre" sans droit spécifique.

PROJET

Projet de type Widget

Vous disposez d'un projet de type Widget validé et correctement configuré dans le SIT.

FICHES

Tracés GPX saisis

Vos fiches itinéraires contiennent un fichier GPX typé Plan et tracé GPS.

Besoin d'aide ? Consultez Etape 1 - Création d'un projet numérique pour le Studio de widgets et Intégration des tracés GPS.

Le parcours en 4 étapes

Sélection

Rassembler les randonnées avec un tracé GPS.

Widget

Créer le widget avec le template Liste + Carte.

Filtres

Proposer la durée, la distance et les équipements.

Intégration

Copier le code et le coller sur votre site.

1. Créer la sélection des randonnées

Dans votre projet de type Widget, ajoutez une sélection qui contient les critères suivants :

Types d'objets

Équipement

Les itinéraires sont saisis en fiches Équipement (EQU).

Types d'activité / d'équipement

Itinéraire

Choisir les itinéraires que vous souhaitez afficher.

Descriptifs thématisés (facultatif)

Topo/pas à pas en Français · non vide

Garantit un descriptif détaillé du parcours dans la fiche.

Types de multimédia

PDF et autres fichiers · Plan et tracé GPS

Remonte les fiches disposant d'un tracé à afficher sur la carte.

3. Paramétrer le widget et ses filtres

L'écran d'édition se divise en 2 parties : la zone de paramétrage à gauche et la zone de prévisualisation à droite. Complétez si besoin les sections Style, Périmètre géographique, Contenu et Champs, comme pour tout widget.

Vérifiez le résultat dans la zone de prévisualisation : cliquez sur un itinéraire pour voir son tracé s'afficher sur la carte.

💡 Pensez à sauvegarder

Enregistrez bien vos modifications avant de quitter la page !

4. Intégrer le widget sur son site

Une fois votre widget configuré :

Récupérez le code d'intégration dans la section Avancé ;
Copiez-le en cliquant sur le bouton Copier le code ;
Collez-le dans la page de votre site web.

Aucune installation technique complexe n'est nécessaire. Vous pouvez installer plusieurs widgets sur une même page.

Un widget = un site

Un widget ne peut être intégré que sur un seul site web (une URL hôte par widget). Pour gagner du temps, dupliquez votre widget de base.

Questions fréquentes

➡️ Le tracé d'une randonnée ne s'affiche pas sur la carte. Pourquoi ?

Vérifiez dans la fiche que le fichier GPX est bien présent dans l'onglet Multimédias et typé Plan et tracé GPS. Vous pouvez contrôler le tracé en ouvrant la fiche en mode consultation, onglet Multimédia et Suggestions.

➡️ Le point de départ n'est pas sur le tracé. Pourquoi ?

Le point de départ correspond à la localisation de la fiche. Corrigez ses coordonnées GPS pour qu'elles tombent sur le parcours.

➡️ Je ne retrouve pas ma sélection dans le Studio. Pourquoi ?

Tant qu'une sélection n'a pas été calculée une première fois, elle ne remonte pas dans le Studio.

➡️ Mon widget ne s'affiche pas sur mon site web. Pourquoi ?

Vérifiez l'URL du site hôte saisie sur le widget et l'intégration du code, qui doit correspondre à celui fourni dans le Studio.

Créer un widget avec tracés GPS