Intégration d'un widget sur un site Google – Apidae Tourisme - Site d'aide aux utilisateurs

STUDIO WIDGETS · GOOGLE SITES

Intégrer un widget Apidae sur un site Google Sites

Vous souhaitez afficher un widget Apidae sur un site créé avec Google Sites, mais celui-ci ne s'affiche pas ou présente un message d'erreur ?

Google Sites utilise un fonctionnement particulier pour intégrer du code HTML et JavaScript. Une configuration spécifique est donc nécessaire dans le Studio Widgets pour autoriser son affichage.

Découvrez comment configurer votre widget et l'intégrer correctement sur votre site.

À retenir

Google Sites affiche les contenus HTML intégrés dans une iframe, hébergée sur un domaine Google différent de l'adresse publique de votre site.

Ce domaine change régulièrement. Pour permettre au widget de fonctionner, il faut renseigner une URL de site hôte avec un astérisque (*) dans le Studio Widgets.

👉 Cette possibilité est disponible depuis l'évolution du Studio Widgets d'octobre 2026.

Configurer

Renseigner la bonne URL de site hôte dans le Studio Widgets.

Intégrer

Copier le code du widget dans un bloc d'intégration Google Sites.

Publier

Publier la page et vérifier le bon affichage du widget.

Pourquoi le widget ne s'affiche-t-il pas ?

Contrairement à une intégration HTML classique, Google Sites n'exécute pas le widget directement depuis l'adresse publique de votre site.

Le code est chargé à l'intérieur d'une iframe, sur un domaine généré par Google.

Par exemple, l'adresse technique utilisée par Google Sites peut prendre cette forme :

https://1560173931-atari-embeds.googleusercontent.com

Après un simple rechargement de la page, ce domaine peut changer :

https://981879536-atari-embeds.googleusercontent.com

Or, pour des raisons de sécurité, les widgets Apidae vérifient que leur utilisation est autorisée sur le site hôte renseigné dans le Studio.

Si vous avez indiqué l'adresse publique de votre Google Sites dans ce champ, le domaine réellement utilisé pour charger le widget ne correspond pas.

Vous pouvez alors rencontrer le message :

Erreur de récupération du widget Apidae.
Ce widget n'est pas autorisé pour ce site internet.

💡 Bon à savoir

Ce comportement ne signifie pas que le widget est mal configuré ou que son code est incorrect. Il est lié à la manière dont Google Sites héberge les contenus intégrés.

Étape 1 : Configurer l'URL du site hôte

Depuis le Studio Widgets Apidae , ouvrez le widget que vous souhaitez intégrer sur votre site Google Sites.

Dans la rubrique Informations, repérez le champ URL du site hôte.

À la place de l'adresse publique de votre site, renseignez exactement l'URL suivante :

URL du site hôte pour Google Sites

https://*-atari-embeds.googleusercontent.com

Enregistrez ensuite les modifications apportées à votre widget.

Pourquoi utiliser un astérisque (*) ?

L'astérisque permet de remplacer la partie variable du domaine utilisé par Google Sites.

Ainsi, que l'iframe soit chargée depuis 1560173931-atari-embeds ou 981879536-atari-embeds, le domaine correspondra au motif autorisé.

👉 Il n'est plus nécessaire de modifier manuellement cette adresse lorsque Google change le domaine de son iframe.

⚠️ Attention

Le Studio Widgets accepte un seul caractère * dans l'URL du site hôte.

Utilisez uniquement le motif indiqué pour les intégrations Google Sites, sans élargir inutilement les domaines autorisés.

Ce motif autorise les sous-domaines Google correspondant à ce format. Il ne limite donc pas l'autorisation à l'adresse publique d'un seul site Google.

Étape 2 : Récupérer le code du widget

Dans le Studio Widgets, ouvrez la rubrique Avancé de votre widget.

Vous y retrouverez son code d'intégration. Cliquez sur Copier le code.

Le code obtenu dépend du type de widget que vous avez créé : liste, carte, agenda, carrousel ou combinaison de plusieurs affichages.

Voici un exemple avec un widget Liste + Carte :

<!-- Intégration Widget Apidae -->
<apidae-widget-liste-carte widget-id="1234" api-url="https://api.apidae-tourisme.com"></apidae-widget-liste-carte>

<script src="https://components.apidae-tourisme.com/apidae-widgets.js" type="module"></script>

💡 À savoir

L'identifiant 1234 est un exemple. Chaque widget possède son propre identifiant, automatiquement présent dans le code fourni par le Studio.

Il est donc préférable de copier directement le code de votre widget plutôt que de recopier cet exemple.

Étape 3 : Intégrer le widget dans Google Sites

Ouvrez votre site dans Google Sites , puis accédez à la page sur laquelle vous souhaitez afficher le widget.

Ouvrir le menu Insérer

Dans le panneau situé à droite de l'éditeur Google Sites, cliquez sur Insérer, puis sur Intégrer.

Choisir l'intégration de code

Dans la fenêtre qui s'ouvre, sélectionnez l'option Intégrer le code.

Coller le code du widget

Collez l'intégralité du code récupéré dans le Studio Widgets, puis cliquez sur Suivant.

Insérer le widget

Cliquez sur Insérer pour ajouter le contenu à votre page. Ajustez si nécessaire la largeur et la hauteur du bloc d'intégration.

⚠️ Important : choisir la bonne méthode

Google Sites propose deux possibilités : intégrer un contenu depuis une URL ou depuis du code HTML.

Pour les widgets Apidae, choisissez Intégrer le code.

Le Studio fournit un code HTML et JavaScript, et non une adresse de page autonome à renseigner dans l'option d'intégration par URL.

Étape 4 : Publier et vérifier le rendu

Une fois le widget intégré à votre page, cliquez sur Publier en haut à droite de Google Sites.

Ouvrez ensuite la page publiée dans votre navigateur pour vérifier l'affichage du widget.

Si le domaine hôte est correctement configuré et que le code est bien intégré, le widget doit pouvoir charger les offres touristiques sélectionnées.

🖥️ Sur ordinateur

Vérifiez que les résultats, les filtres et, si nécessaire, la carte s'affichent correctement.

Ajustez la taille du bloc d'intégration si son contenu est coupé.

📱 Sur mobile

Testez également votre page depuis un téléphone pour vérifier la lisibilité et l'utilisation du widget.

Selon la mise en page du site, l'espace réservé à l'intégration peut nécessiter des ajustements.

💡 Bon réflexe

Vérifiez toujours le résultat sur la page publiée. L'aperçu de l'éditeur Google Sites ne reflète pas nécessairement le comportement final du widget.

En cas de problème

Si le widget ne s'affiche toujours pas sur votre site Google Sites, voici les principaux éléments à vérifier.

Vérifier l'URL du site hôte

Dans le Studio Widgets, assurez-vous d'avoir indiqué exactement :

https://*-atari-embeds.googleusercontent.com

Vérifier le code d'intégration

Assurez-vous d'avoir copié l'intégralité du code fourni dans la rubrique Avancé du Studio, y compris la balise <script>.

Vérifier la configuration du widget

Contrôlez notamment sa sélection, son identifiant et l'enregistrement des derniers changements dans le Studio.

Tester la page publiée

Republiez votre site, rechargez la page et vérifiez que le bloc d'intégration dispose d'une hauteur suffisante.

Le widget indique toujours « Non autorisé » ?

Vérifiez en priorité l'URL du site hôte. Si le problème persiste malgré la bonne configuration et la publication du site, contactez votre animateur Apidae en lui communiquant :

l'identifiant de votre widget
l'adresse publique de votre page Google Sites
une capture du message d'erreur rencontré

Ce qu'il faut retenir

Google Sites utilise une iframe hébergée sur un domaine dynamique.
L'adresse publique de votre site ne correspond donc pas au domaine qui charge réellement le widget.
Renseignez https://*-atari-embeds.googleusercontent.com comme URL du site hôte dans le Studio Widgets.
Récupérez le code d'intégration depuis la rubrique Avancé de votre widget.
Dans Google Sites, utilisez Insérer → Intégrer → Intégrer le code.
Publiez votre site et vérifiez le résultat sur la page en ligne.

Pour aller plus loin

Retrouvez nos tutoriels complémentaires sur les widgets Apidae :