Intégration d'un widget sur un site Jimdo

Lors de l’intégration d’un widget Apidae sur un site Jimdo, il est possible que rien ne s’affiche sur la page.

Ce comportement ne vient pas du widget Apidae, mais de Jimdo.

Jimdo filtre automatiquement le code HTML et supprime certaines balises non reconnues, notamment les balises personnalisées utilisées par les widgets Apidae, comme :

<apidae-widget-liste-carte>

Résultat :

• la balise est supprimée lors de l’enregistrement
• le widget ne peut pas se charger

Pour éviter ce problème, il est nécessaire de passer par une injection via JavaScript.

Étape 1 : Ajouter un bloc HTML

Dans Jimdo, ajouter un bloc HTML / Widget sur la page où vous souhaitez afficher le widget.

Étape 2 : Adapter le code d’intégration

Jimdo supprimant les balises personnalisées, il est nécessaire de passer par une insertion via JavaScript.

Utiliser le code suivant (à adapter ensuite) :

<div id="widget"></div>

<script>
document.getElementById('widget').innerHTML = 'VOTRE_CODE_WIDGET';
</script>

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

👉 Remplacer VOTRE_CODE_WIDGET par le code de votre widget.

Exemples de code selon le type de widget

Les exemples ci-dessous sont à utiliser à la place de VOTRE_CODE_WIDGET.

⚠️ Pensez à remplacer widget-id="1234" par l’identifiant de votre widget. Vous pouvez le retrouver dans l’onglet "Avancé" de l’Apidae Studio :

Liste :

<apidae-widget-liste widget-id="1234"></apidae-widget-liste>

Agenda :

<apidae-widget-agenda widget-id="1234"></apidae-widget-agenda>

Carte :

<apidae-widget-carte widget-id="1234"></apidae-widget-carte>

Carrousel :

<apidae-widget-carrousel widget-id="1234"></apidae-widget-carrousel>

Liste + carte :

<apidae-widget-liste-carte widget-id="1234"></apidae-widget-liste-carte>

Agenda + carte :

<apidae-widget-agenda-carte widget-id="1234"></apidae-widget-agenda-carte>

Exemple complet

<div id="widget"></div>

<script>
document.getElementById('widget').innerHTML = '<apidae-widget-liste-carte widget-id="1234"></apidae-widget-liste-carte>';
</script>

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

Étape 3 : Publier la page

Enregistrer et publier la page.

👉 Un message d’erreur peut apparaître dans l’aperçu Jimdo.
Ce comportement est normal.

Étape 4 : Vérifier le rendu

Ouvrir la page publiée sur votre site.

Le widget doit s’afficher correctement.

En cas de problème

Si le widget ne s’affiche pas sur le site en ligne :

• vérifier la configuration du widget
• contrôler l’URL du site autorisé (site hôte)
• s’assurer que l’URL correspond exactement à celle du site Jimdo