Explications avec tableaux
Informations

Explications avec tableaux
L'IA peut vous épargner du temps lorsque vient le temps de créer des contenus à l'intérieur de vos pages Moodle. Cet exemple vous démontre il est possible générer un contenu HTML Bootstrap sans qu'il soit nécessaire d'utiliser un éditeur.
Date
2025-12-23
Secteur
FGA, FP, Primaire, Secondaire
Type de ressource
Requête
Organisation
CSS des Premières-Seigneuries
Fonction
Récit National
IAG
Canva, Copilot, Gemini
Production
HTML
Requête
Conseil : utiliser Gemini avec les options « Canevas » et « Réflexion »

Tu es un enseignant de science au secondaire au Québec.
Tu dois présenter à tes élèves un tableau des propriété physiques caractéristiques.
Tu dois utiliser des substances utilisées fréquemment afin de permettre aux élèves de comprendre le concept.
Au dessus du tableau, tu dois présenter le concept et fournir la définition.
Sous le tableau, tu dois présenter un exemple d'utilisation d'une propriété physique caractéristique, par exemple, pour identifier un métal inconnu.
En bas de page, tu dois résumer le sujet.
Utiliser mathjax avec les délimiteurs \(
Doubler les barres obliques (\\) dans les chaînes de caractères du script.
⚠️ Attention : les "Moodleurs" doivent ajouter ce complément de requête pour Moodle après la validation dans Canvas afin de récupérer le code source dans une page Moodle.
Instructions Techniques (TRÈS IMPORTANTES) :Technologie : Utiliser Bootstrap 4 (supposé présent dans Moodle) et du JavaScript "vanilla" (pas de jQuery ou React).
Compatibilité Moodle (JavaScript) :
Aucun attribut 'inline' (pas de onclick="..." dans le HTML).
Placer tout le JavaScript dans une seule balise <script> à la toute fin du code.
Le script doit s'exécuter après le chargement (utiliser document.addEventListener('DOMContentLoaded', ...)).
Utiliser querySelectorAll ou la délégation d'événements (document.body.addEventListener('click', ...) qui est plus robuste) pour attacher les fonctions aux boutons.
Utiliser des attributs data-* (ex: data-correct, data-target) sur les éléments HTML pour stocker les informations (comme les réponses ou les ID cibles).
Compatibilité Moodle (CSS) :
Aucune balise <style>.
Si des styles sont nécessaires (ex: cacher un élément), les placer "inline" (ex: style="display:none;").
Format de sortie : Fournir le code comme un fragment HTML unique (sans <html>, <head> ou <body>) prêt à être collé dans la vue HTML (</>) de l'éditeur Moodle.