[Moodle|Guide] Intégrer une page externe / un iframe

Instructions

Étape 1 : Choisir votre approche

Moodle propose trois principales façons d’intégrer une page externe :

1. URL intégrée : le contenu est affiché dans un cadre avec défilement, largeur adaptée à la page.
   Avantage : simplicité et fiabilité.
   Limitation : la fenêtre reste relativement petite sur grand écran, mais le contenu est toujours accessible.

2. Embed code dans une Page : certains outils externes fournissent un code d’intégration à copier-coller.
   Avantage : possibilité d’intégrer directement le contenu dans une page Moodle.
   Limitation : certains scripts ne fonctionnent pas, le contenu peut être tronqué. Il est parfois nécessaire de modifier le code pour supprimer certaines balises <script>.

3. H5P IFrame Embedder : intégrer la page dans un contenu H5P.
   Avantage : ajustement automatique de la largeur et possibilité de définir une hauteur minimale.
   Limitation : le défilement n’est pas supporté, il faut tester la hauteur et prévoir une marge de sécurité.

Étape 2 : Intégrer la page

Option 1 : via la ressource URL

1. Activez le mode édition dans votre cours.

2. Cliquez sur Ajouter une activité ou ressource → URL.

3. Complétez le nom de votre page.

4. Collez le lien de votre page externe dans le champ URL externe.

5. Dans le paramètre Mode d’affichage, choisissez Intégrer.

6. Cliquez sur Enregistrer et revenir au cours.

Option 2 : via embed code dans une Page

1. Activez le mode édition dans votre cours.

2. Cliquez sur Ajouter une activité ou ressource → Page.

3. Complétez le nom de la page.

4. Dans l’éditeur, basculez en code source (HTML).

5. Collez le embed code fourni par l’outil externe.

6. En cas de contenu tronqué, supprimez les balises <script> dans le code pour tester l’affichage.

7. Cliquez sur Enregistrer et revenir au cours.

Option 3 : avec H5P IFrame Embedder

1. Activez le mode édition dans votre cours.

2. Dans la section de votre choix, cliquer sur “+” → Ajouter une activité ou une ressource.

3. Choisissez Contenu Interactif H5P.

4. Écrire une description pour l’activité.

5. Dans le champ Éditeur, choisir H5P IFrame Embedder.

6. Complétez le titre du contenu.

7. Spécifiez une largeur standard et une largeur minimale (le contenu s’adaptera à la largeur de la fenêtre).

8. Spécifiez la hauteur du cadre, en testant différentes valeurs pour afficher tout le contenu. Prévoyez une marge de 10 %.

9. Collez le lien d’affichage de votre page dans le champ Source.

10. Vous pouvez autoriser le redimensionnement du contenu, mais notez que le défilement n’est pas supporté en mode plein écran.

11. Éditez les paramètres habituels des activités Moodle selon votre besoin.

12. Cliquez sur Enregistrer et revenir au cours.