❗️AVIS IMPORTANT : Nous avons maintenant publié la toute nouvelle version 5.0 des modèles HTML ! 🎉Pour en savoir plus sur cette mise à jour, voir notre article sur les modèles HTML Version 5.0, où vous pourrez également accéder au téléchargement gratuit et à un lien pour parcourir les nouveaux modèles dans le Centre d’apprentissage.
Créez superbe, réactif, accessible et maintenant interactives pages de rubrique de contenu à l’aide des mises en page fournies dans le package de modèles ci-joint. Les mises en page conviviales pour l’instructeur incluses sont conçues pour être modifiées à l’aide de l’éditeur HTML dans l’environnement d’apprentissage.
Pour commencer :
1) Téléchargez le package de modèle Brightspace_HTML_Template_v3.zip
2) Suivez le document d’instructions étape par étape dans le package Brightspace_HTML_Template_Guide_v3.0.docx
*Notez qu’il peut être utile de téléverser les modèles dans un module ou une unité configuré pour brouillon pour les enseignants, afin de les aider à ajouter des éléments aux pages qu’ils construisent. Les enseignants et les administrateurs de Brightspace peuvent également utiliser les ressources préchargées dans le Centre d’apprentissage (sur un onglet ou un moniteur du navigateur) et accéder aux boutons copier le code de cet environnement et coller ce code interactif dans la page qu’ils créent (dans un autre onglet ou moniteur du navigateur).
Importer des modèles HTML version 3.0
Modifier et ajouter des éléments dynamiques à l’aide de modèles HTML Version 3.0
Problèmes connus
- Ces modèles ne sont actuellement pas recommandés pour le matériel d’apprentissage destiné à l’impression et à l’enregistrement en dehors de l’environnement d’apprentissage.
- Pour créer une sauvegarde du cours ou pour conserver une copie du cours pour vos propres enregistrements, il est recommandé de stocker les modèles HTML au niveau du cours et d’utiliser l’outil Importer/Exporter/Copier des composants pour exporter le package du cours, et « inclure les fichiers de cours dans le package d’exportation », ainsi que « Tous les éléments » sous « Apparence du cours ».
- Nous vous recommandons d’ajouter des images dans une page de modèle à l’aide des boutons « Insérer une image » ou « Insérer des choses » dans l’éditeur HTML. Cela facilite l’ajout de votre texte de remplacement. Si vous collez une image à l’intérieur du modèle, vous ne serez pas invité à ajouter le texte de remplacement tant que vous n’aurez pas exécuté le vérificateur d’accessibilité.
- Lors de l’ajout de modèles à utiliser dans la nouvelle expérience de contenu / leçons, il est recommandé de taper le chemin d’accès au fichier pour les modèles dans la valeur du navigateur de la variable de configuration (étape 2, #5 dans le Brightspace_HTML_Template_Guide) copier et coller le chemin d’accès au fichier peut entraîner des problèmes de formatage qui empêcheront un accès facile aux modèles à partir d’un cours.
Pour les clients utilisant l’exemple Modèles HTML v3.0 : Conférence vidéo page : Veuillez noter qu’après la mise à jour 20.23.03, les vidéos hébergées dans la bibliothèque multimédia Brightspace sont réactives automatiquement sans avoir à insérer de vidéos dans les sections de wrapper vidéo. Pour que les vidéos de la bibliothèque multimédia Brightspace s’affichent correctement à l’aide de l’exemple de page Modèles HTML v3.0 : Conférence vidéo, une révision CSS est requise. Les étapes sont décrites ci-dessous.
Remarque : Les clients qui utilisent les modèles HTML C+ ou qui n’utilisent pas les modèles HTML personnalisés ne sont pas affectés.
- Dans le dossier contenant votre copie des modèles HTML, accédez au _assets/css/ dossier
- Modifiez le fichier custom.css. Le fichier peut être modifié :
- Directement dans l' vue Gérer les fichiers vue en sélectionnant le menu déroulant et en choisissant Modifier le fichier.
- En téléchargeant, apportant des modifications dans un éditeur de code et en téléversant à nouveau le fichier.
Ajoutez l’extrait de code suivant :
.video-wrapper iframe[src*="/d2l/wcs/mp/mediaplayer.d2l"] {
position : relative ;
min-largeur : 100% ;
marge : auto ;
affichage : bloc ;
}
.video-wrapper iframe[src*="/d2l/wcs/mp/mediaplayer.d2l"] :not([style]) {
largeur maximale : 100% ;
min-hauteur : 340px ;
}
.embed-responsive :has(iframe[src*="/d2l/wcs/mp/mediaplayer.d2l"]) ::before {
affichage : aucun ;
}
Les vidéos de la bibliothèque multimédia Brightspace s’afficheront désormais correctement dans la section de contenu vidéo fournie.
À quoi ressemblent-ils ?
Ce n’est qu’un petit échantillon des styles de page que vous obtenez dans ce téléchargement gratuit !
Vous pouvez voir une version en direct des modèles dans Brightspace.
En savoir plus sur les modèles mis à jour dans le Centre d’apprentissage
Arrêtez-vous par le Centre d’apprentissage pour parcourir les modèles.
Remarque : L’accès au centre d’apprentissage est fourni aux instructeurs et aux administrateurs qui utilisent actuellement Brightspace. Vous devez être connecté à la communauté avec l’adresse e-mail de votre école ou organisation pour vérifier votre accès au contenu freemium et premium learning center.
Nom de fichier:
Brightspace_HTML_Template_v3.zip
Date de publication: mai 2020
Description: Ce modèle est conçu pour aider les non-développeurs à créer des pages de contenu réactives, accessibles et interactives à l’aide de l’éditeur HTML Brightspace (éditeur WYSIWYG). Cette version comprend maintenant :
- Éléments interactifs, y compris des accordéons et des onglets
- Mise à jour des styles de page exemples
- Instructions d'installation des modèles désormais situées à l’extérieur du package zip
- Ressources supplémentaires dans le Centre d’apprentissage, y compris de nouveaux boutons Copier le code pour faciliter la copie et le collage d’éléments
Version précédente 2.0
Nom de fichier:
Daylight_HTML_Template_v2.zip
Date de publication: mai 2018
Description: Ce modèle est conçu pour aider les non-développeurs à créer des pages de contenu propres, fonctionnelles et professionnelles à l’aide de l’éditeur HTML Brightspace (éditeur WYSIWYG). Les pages modélisées sont entièrement réactives et accessibles. De plus, dans cette version :
- Une structure de fichiers simplifiée facilite la configuration des modèles
- Une meilleure CSS facilite l’édition de contenu
- Des mises en page à colonne unique simplifient l'édition de la page
- Le contenu exemple des modèles contient maintenant des instructions et des meilleures pratiques pour guider les utilisateurs
Plein feux sur les clients
Lors de notre fusion virtuelle en décembre 2020, nous avons été rejoints par 2 super-héros Brightspace qui ont partagé leurs expériences en utilisant des modèles HTML sur leurs lieux d’apprentissage.
Accédez aux modèles personnalisés utilisés au Minnesota State College Southeast et généreusement contribué par John Bayerl, l’ancien directeur de l’excellence de l’enseignement au Minnesota State College Southeast
Regardez la présentation enregistrée de Fusion pour en savoir plus sur l’utilisation des modèles HTML de John Bayerl du Minnesota State College Southeast et Jeff Cummings du Wellington Catholic District School Board en Ontario.
Accéder au cours
📝 Vous devez être un client Brightspace et connecté à la nouvelle authentification unique pour la communauté pour accéder à cette ressource
Langues disponibles : Anglais
Commentaires et soutien
Bien que nous espérions apporter des améliorations supplémentaires au modèle HTML V3 à l’avenir, à ce stade, D2L ne s’engage pas à le prendre en charge ou à le maintenir. Néanmoins, nous accueillons vos commentaires et vous encourageons à partager des conseils, astuces, extensions, etc., avec vos collègues membres de la communauté !