Enseignant éditeur
3. L'éditeur de texte
C'est le nouvel éditeur de Moodle (à partir de la version Moodle 4.1).
Avantages et inconvénients :
Cette version de l’éditeur TinyMCE permet :
- d’insérer des images par glisser-déposer et de les redimensionner facilement,
- de créer des tableaux complexes ;
- de vérifier l’accessibilité du contenu produit (c’est-à-dire possibilité pour les personnes en situation de handicap d'accéder aux informations) ;
- d’intégrer directement du contenu H5P (nous aborderons H5P plus tard dans cette formation) ;
- d’insérer des équations (Notation TeX) à l'aide d'un éditeur d’équation (les filtres doivent être activés par l'administrateur),
- d’insérer des éléments HTML (ligne horizontale, espace insécable, ancre...)
En revanche, il ne permet pas :
- de modifier facilement la couleur du texte et la police de caractère (NB : ces fonctionnalités font partie de la feuille de route des prochaines versions),
NB (pour les connaisseurs 😀) :
- De nombreux plugins existants et bien utiles (éditeur de questions Cloze ; éditeur Bootstrap ; embeded questions ; etc) que l'on retrouve dans l'éditeur Atto ne sont pas encore disponibles dans ce nouvel éditeur TinyMCE 6. Utilisez Atto si vous avez besoin des fonctionnalités supplémentaires proposées par ces plugins tiers (s'ils sont installés sur votre plateforme).
- Pour les administrateurs / gestionnaires : Aucun paramètre d'administration pour contrôler le menu et les barres d'outils n'est pour l'instant prévu.
- La colorisation syntaxique de la vue HTML n'est pas (encore ?) disponible dans TinyMCE 6. Là aussi, Atto peut encore rendre de nombreux services...
La barre d'outils (icônes de l'éditeur) :
L'éditeur se présente replié, dépliez-le pour accéder à toutes les fonctionnalités :
Une fois déplié, voici les boutons des fonctionnalités de l'éditeur disponibles pour cette plateforme
| 1 | Annuler | 13 | Insérer un contenu H5P / modifier les propriétés d’un contenu H5P |
| 2 | Refaire | 14 | Aligner à gauche |
| 3 | Gras | 15 | Centrer |
| 4 | Italique | 16 | Aligner à droite |
| 5 | Couleur de premier plan | 17 | Justifier |
| 6 | Couleur de fond | 18 | Aligner paragraphe à gauche |
| 7 | Insérer une image / modifier les propriétés de l’image | 19 | Aligner paragraphe à droite |
| 8 | Insérer un média (audio ou vidéo) / modifier les propriétés | 20 | Indenter |
| 9 | Enregistrement audio | 21 | Réduire l'indentation |
| 10 | Enregistrement vidéo | 22 | Liste à puces |
| 11 | Insérer un lien | 23 | Liste numérotée |
| 12 | C4L | 24 | Editeur d'équation |
NB: des informations sur les fonctionnalités des boutons s'affichent au survol de la souris :
Formater votre texte :
- La mise en forme du texte se fait en sélectionnant le texte que vous venez d'écrire, une petite barre apparait alors :
- D'autres possibilités de mise en forme sont disponibles dans le menu "Format" :
Insérer une image :
- Glissez-déposez simplement l'image de votre choix à partir de votre explorateur de fichiers.
- Vous pouvez ensuite l'éditer :
- avec une description pour les personnes en situation de handicap ;
- en adaptant sa taille (cochez bien le "dimensionnement automatique" pour que votre image reste "responsive" !) ;
- en adaptant sa position.
- Vous pouvez également insérer une image à partir de l'icône pour accéder directement à l'édition de ses propriétés.
- Attention à la taille de vos images, si elle trop importante cela peut retarder son chargement sur la page de l'utilisateur et cela occupera une place inutile sur le serveur.
Insérer un lien :
- Pour rendre cliquable une partie de votre texte et en faire un lien hypertexte, sélectionnez le texte à lier avec votre souris puis cliquez sur l'icône (accessible également via le menu "Insérer", avec plus d'options).
- Renseigner ensuite l'URL du lien et le comportement souhaité lors de l'ouverture du lien (s'ouvre dans une "nouvelle fenêtre" signifie "nouvel onglet" en réalité).
Insérer une vidéo YouTube :
A partir du lien de la vidéo :
- Copiez le lien de la vidéo en cliquant droit directement sur la vidéo puis "Copier l'Url de la vidéo" ou bien à partir du bouton "Partager". (Attention, ne prenez pas le lien de la page YouTube (dans la barre d'adresse du navigateur !)
- Collez directement ce lien sur votre zone de texte, le filtre multimédia de Moodle se chargera de transformer ce lien en une vidéo intégrée à votre cours.
A partir du code d'intégration de la vidéo :
- Cette option vous permettra d'éditer plus facilement la taille d'affichage de votre vidéo
- Copiez le code d'intégration de la vidéo en cliquant droit directement sur la vidéo puis "Copier le code d'intégration" ou bien à partir du bouton "Partager" puis "Intégrer".
- Ouvrez le menu "Afficher" puis "<> Code source" dans l'éditeur TinyMCE puis collez-y directement le code que vous venez de copier.
- Vous pouvez personnaliser la largeur (width) et la hauteur (height) de votre vidéo directement dans le code HTML.
Insérer et mettre en forme un tableau :
- Depuis le menu Tableau, choisissez le nombre souhaité de lignes et de colonnes :
- Sélectionner le tableau fait apparaitre une barre d'outils pour ajouter ou supprimer des lignes ou des colonnes :
- Si vous sélectionnez des cellules puis cliquez ensuite sur le menu "Tableau", vous pourrez fusionner ou diviser ou accéder aux propriétés de ces cellules :
- Les propriétés des cellules, rangées, colonnes ou du tableau lui-même vous permettent d'acceder à bon nombre d'options (alignement, type de cellule, marges, etc) :
- Les propriétés avancées vous permettent de déterminer des couleurs et épaisseurs de bordures, des couleurs de fond (qui peuvent être différentes d'une cellule à l'autre) :
- Si vous ajoutez une légende (via les propriétés du tableau), elle s'affichera en bas du tableau en mode édition et en haut en mode normal.
