Comment bien utiliser l`éditeur HTML

Procédure « Bien utiliser l’éditeur HTML »
CIP - 06/10/2010
Comment bien utiliser l’éditeur HTML
QUELQUES
PETITS CONSEILS ET ASTUCES POUR AJOUTER DES INFORMATIONS SUR
MOODLE
PRE-REQUIS : Procédure « Démarrer sur Moodle »
Procédure « Déposer des documents sur Moodle »
QU’EST-CE
QUE L’EDITEUR
HTML
A chaque fois que Moodle vous propose d’ajouter un texte sur la plateforme, pour décrire votre cours,
ajouter un article dans le glossaire, poser une question dans le QCM ou ajouter un évènement, vous
obtenez une zone de texte un peu spéciale. Il s’agit de l’éditeur HTML :
Le HTML est le langage de programmation dans lequel est décrit la présentation des pages des sites
internet.
Afin de permettre la saisie par des utilisateurs non programmeur, un éditeur HTML a été mis en place
pour vous permettre de mettre en forme votre texte comme dans un éditeur bureautique.
Vous n’avez donc pas à apprendre le HTML pour rédiger du contenu sous Moodle.
Si vous souhaitez en savoir plus, vous pouvez toutefois lire ce cours à destination des débutants :
http://www.siteduzero.com/tutoriel-3-13666-apprenez-a-creer-votre-site-web.html
Pour toutes questions ou informations, contacter : [email protected]
1
Procédure « Bien utiliser l’éditeur HTML »
CIP - 06/10/2010
LES FONCTIONNALITÉS
DE L’ÉDITEUR
Outre les fonctionnalités que vous connaissez bien tel que le choix de la police, de la taille du texte, et
de l’alignement, il y a des fonctionnalités moins intuitives.
 La fonction copier/coller
L’un des gros avantages de l’éditeur, c’est qu’il est possible de copier/coller du texte rédigé depuis un
autre éditeur. Vous pouvez ainsi copier un texte mis en forme depuis OpenOffice.org Writer, Microsoft
Word ou même depuis un autre site internet directement dans l’éditeur.
Cette fonctionnalité ne copiera pas les images vous devrez donc déposer vos documents sur Moodle
puis insérer l’image à l’aide de l’outil d’insertion d’image.
Par contre cela vous permettra de faire de jolis tableaux dans OpenOffice Writer et de les importer,
ensuite, plus facilement dans Moodle.
 La fonction lien
La base d’un site internet, ce sont les liens entre les différentes pages ou fichiers du site.
Avec Moodle, vous pouvez faire des liens vers d’autres pages ou certains fichiers à l’aide de l’outil.
 Insérer un son, une vidéo ou une applet flash
Si vous liez une vidéo ou un fichier musical dans un format reconnu par Moodle, il s’affichera
directement dans la page afin de permettre au visiteur de l’exécuter sans quitter la page. Il est ainsi
possible dans un glossaire d’ajouter un ficher contenant la prononciation du mot.
Pour toutes questions ou informations, contacter : [email protected]
2
Procédure « Bien utiliser l’éditeur HTML »
CIP - 06/10/2010
 Insérer une vidéo Youtube
Pour ajouter une vidéo Youtube ou Dailymotion directement dans une page, il faut utiliser non pas le
lien vers la page, mais le lien vers la vidéo.
Sous Youtube :
-
Lorsque le lien vers la page est : http://www.youtube.com/watch?v=MSOmHF4qyQA
-
Le lien vers la vidéo est : http://www.youtube.com/v/MSOmHF4qyQA?.swf
Il suffit de récupérer de remplacer le /watch?v= par /v/ dans l’adresse de la page.
Sous Dailymotion
-
Lorsque le lien vers la page est : http://www.dailymotion.com/video/xf12uf_sintel-theopen-movie-project-versi_shortfilms
-
Le lien vers la vidéo est : http://www.dailymotion.com/swf/video/xf12uf_sintel-the-openmovie-project-versi_shortfilms?.swf
Il suffit de rajouter /swf/ avant /video/ dans l’adresse de la page.
Dans les deux cas il ne faut pas oublier d’ajouter ?.swf à la fin de l’adresse de la page pour
permettre à Moodle de détecter qu’il s’agit bien d’une vidéo.
Ce qui donne le résultat suivant :
Il est possible de spécifier la taille de l’applet en l’ajoutant comme ceci à la fin : ?d=600x480
Pour toutes questions ou informations, contacter : [email protected]
3
Procédure « Bien utiliser l’éditeur HTML »
CIP - 06/10/2010
 Ajouter des caractères spéciaux
Il est possible d’ajouter des caractères spéciaux dans le texte à l’aide du bouton
Il suffit ensuite de sélectionner le caractère souhaité.
 Ajouter de binettes (smileys)
Il est possible d’ajouter des binettes pour donner vie au contenu à l’aide du bouton
Attention, les binettes ne remplacent pas la ponctuation et doivent être utilisés avec modération.
Pour toutes questions ou informations, contacter : [email protected]
4
Procédure « Bien utiliser l’éditeur HTML »
CIP - 06/10/2010
 Rechercher / Remplacer
Il est possible d’utiliser la fonction Rechercher/Remplacer à l’aide du bouton
.
Les expressions régulières
L’une des options possibles est la possibilité d’utiliser les expressions régulières.
Les expressions régulières sont un moyen d’écrire des patrons de recherche.
Par exemple si on veut que toutes les allusions à la couleur bleu ou rouge soient remplacées par la
couleur orange, on va pouvoir le faire ainsi :
Après validation, on obtient un message de confirmation et le texte est modifié :
Pour toutes questions ou informations, contacter : [email protected]
5
Procédure « Bien utiliser l’éditeur HTML »
CIP - 06/10/2010
Distinction de la casse
La casse c’est le fait qu’une lettre soit considérée comme un caractère Majuscule ou minuscule.
Lorsqu’on distincte la casse, A et a sont deux caractères différent. Dans le cas précédent, bleu et
Bleu ne sont donc pas le même mot et le remplacement s’effectue uniquement pour bleu et non
pas pour Bleu.
Si on ne distincte pas la casse, les lettres A et a sont considéré comme étant le même ensemble et la
distinction entre majuscule et minuscule n’est donc pas prise en compte.
Si on recherche le mot bleu sans distinction de la case, on aura 16 possibilités d’écriture du mot bleu
qui seront valide lors de la recherche.
Si on recherche le mot bleu avec distinction de la case, on aura une unique possibilité d’écriture pour
ce mot.
 L’éditeur mathématique : DrawMath
Il est possible d’utiliser le bouton
pour afficher un éditeur de formules mathématiques.
Son utilisation est détaillé spécifiquement dans la procédure « Formules Latex dans Moodle »
 L’éditeur du code HTML
Il est possible d’utiliser le bouton
pour afficher le code HTML du bloc que l’on est en train d’éditer.
Cela est très pratique pour être sur que l’éditeur fait bien ce qu’on lui demande.
 Le mode plein écran
Il est possible de passer l’éditeur en mode plein écran à l’aide du bouton
Cela permet d’agrandir l’éditeur pour avoir un confort de saisie supplémentaire.
Lors du passage en mode plein écran, la barre d’outils de gestion des tableaux apparait, vous
permettant de simplifier encore la mise en page des tableaux dans l’éditeur.
 Notes du rédacteur
Si vous ne comprenez pas l’utilité d’un bouton, vous pouvez le survoler pour avoir un texte explicatif.
N’hésitez pas à tester les fonctionnalités méconnues cela vous permettra de bien prendre en main
l’outil.
Sur un site internet, ce qui importe c’est le contenu et la simplicité que l’on a à le lire.
Allez à l’essentiel et éviter trop de fioritures, changements de couleurs, de tailles et de police.
Pour toutes questions ou informations, contacter : [email protected]
6