On le retrouve dans plusieurs modules tels que le courrier, le forum, l agenda, les tâches, les communiqués et plus particulièrement dans Édu-Notes.

Transcription

1 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur 145 L ÉDITEUR DE TEXTE L éditeur de texte du portail est une application destinée à créer et modifier des textes pour créer des documents HTML. L éditeur de texte possède certaines fonctions que l on retrouve aussi dans les logiciels de traitement de texte, mais il est plus limité dans ses possibilités. On le retrouve dans plusieurs modules tels que le courrier, le forum, l agenda, les tâches, les communiqués et plus particulièrement dans Édu-Notes.

2 146 Les éditeurs de textes Barre d outils d Édu-notes BARRE D OUTILS D ÉDU-NOTES L éditeur Édu-Notes se présente avec une barre d outils usuelle qui est la même dans l éditeur de base que dans l éditeur avancé. Elle permet principalement l entreposage et la récupération de fichiers HTML directement dans le portail. On retrouve également Édu-Notes dans l édition du courrier électronique, l éditeur du détail de l agenda, l éditeur des tâches, l éditeur du détail des communiqués, etc. Nouveau fichier Cliquez sur l icône Ajouter. Enregistrer les modifications, Enregistrer le fichier sous un autre nom Si le document a déjà été enregistré et que vous voulez qu il soit encore enregistré au même endroit sous le même nom (donc, il écrasera le fichier précédent), cliquez sur Enregistrer. Si le document n a pas été enregistré, vous pouvez cliquer sur Enregistrer ou sur Enregistrer sous. Si le document a déjà été enregistré, mais que vous vouliez l enregistrer sous un autre nom (pour ne pas écraser le fichier original), cliquez sur Enregistrer sous.

3 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur 147 Pour les deux dernières situations, voici le processus : 1. Cliquez sur l icône appropriée ou. 2. Cliquez sur le dossier du portail dans lequel vous voulez enregistrer la pièce. 3. Inscrivez un nom pour ce fichier. 4. Cliquez sur le bouton Ok. Le fichier sera enregistré sous le format HTML.

4 148 Les éditeurs de textes Barre d outils d Édu-notes Ouvrir un fichier Avec l éditeur Édu-Notes, vous pouvez ouvrir un fichier HTML qui est enregistré sur le portail. 1. Cliquez sur l icône Ouvrir un fichier. 2. Allez au dossier contenant le fichier désiré. 3. Cliquez sur le nom du fichier à ouvrir. Ouvrir un fichier à partir de la gestion de fichiers Les fichiers HTML sauvegardés dans le portail peuvent être édités avec Édu-Notes. 1. Sélectionnez le module des fichiers. 2. Sélectionnez le dossier contenant le fichier à éditer. 3. Cliquez sur l icône Éditer.

5 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur 149 LES FONCTIONS DE L ÉDITEUR DE TEXTE L'éditeur de textes aussi appelé Édu-Notes, est un outil de base permettant d'écrire dans les modules suivants : le courriel, les communiqués, les tâches, les agendas, les forums et l'éditeur de pages web. Voici un énoncé sommaire des différentes fonctions offertes. Mise en forme des caractères : Gras : Italique : Souligné : Exposant : Indice : Barré : Convertir en minuscule : Convertir en majuscule : Taille des caractères : Couleur des caractères : Couleur de fond, derrière les caractères : Polices de caractères Mise en forme des paragraphes : Aligner à gauche : Centrer : Aligner à droite : Justifier intégralement : Liste numérotée : Liste à puces : Diminuer le retrait : Augmenter le retrait : Styles de paragraphe (normal, titre, liste, etc.)

6 150 Les éditeurs de textes Les fonctions de l éditeur de texte Outils d édition : Couper : Copier : Coller : Coller en préservant la mise en forme de Word : Annuler : Rétablir : Supprimer les étiquettes ou les formats : Imprimer : Rechercher - Remplacer : Correcteur orthographique Les tableaux : Insérer un tableau : Insérer une ligne au dessus. : Insérer une ligne en dessous : Supprimer la ligne : Insérer une colonne à gauche : Insérer une colonne à droite : Supprimer la colonne : Supprimer une cellule : Combiner les cellules horizontales : Combiner les cellules verticales : Propriété de la cellule : Propriété du tableau

7 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur 151 Les images Grâce aux techniques de Copier/Coller ou du Glisser, nous pouvons insérer des images provenant du WEB. Édu-Notes retiendra l URL de l image et non celle-ci en tant que fichier. Nous ne pouvons insérer une image qui provient du poste de travail, mais nous pouvons insérer une image qui provient du portail contenue dans un dossier public. Cette image a ainsi une adresse URL. : Insérer une image : Insérer une émoticône. : Placer absolument l image sélectionnée Les diverses insertions : Les caractères spéciaux : Insérer un lien : Annuler un lien : Insérer un paragraphe : Insérer une ligne : Insérer une date : Insérer l heure

8 152 Les éditeurs de textes Insérer une image INSÉRER UNE IMAGE Dans l'éditeur du portail Édu-groupe, il existe des façons différentes d'insérer une image : Copier/coller ou glisser une image d une page Web Note : Il n est pas possible de glisser une image avec Internet Explorer Allez à la page Web où se situe l image visée. 2. Avec le bouton droit de la souris (Apple : pomme clic), cliquez sur l image et choisissez Copier. 3. Allez dans la zone de texte de l éditeur du portail et collez l image. Consulter les fichiers d image se trouvant dans des dossiers publics 1. Dans l éditeur du portail, cliquez sur le bouton Gestionnaire d images. 2. Cliquer pour sélectionner la communauté dans laquelle se trouve l image recherchée. 3. Double-cliquez le dossier de la communauté ou le dossier personnel pour lequel vous voulez naviguer les images.

9 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur Parcourir les dossiers publics contenant les images. 5. Sélectionnez l'image que vous souhaitez importer dans Édu-Notes et cliquez sur le bouton Appliquer. 6. Cliquez sur Ok afin de voir le résultat.

10 154 Les éditeurs de textes Insérer une image Modifier une image à la volée Notez que la modification des dimensions d'une image à la volée n'est pas possible avec Safari. 1. Pour redimensionner une image, sélectionnez l'image à éditer et saisir une des poignées avec la souris. Modifier une image à l'aide des propriétés 1. Sélectionnez l'image que vous souhaitez modifier et faites un clique droit afin d'ouvrir le menu contextuel. Sélectionnez l'item Ajuster les propriétés de l'image. 2. Sélectionnez les paramètres désirés. 3. Cliquez sur le bouton Ok afin d'approuver les changements.

11 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur 155 MAPPER UNE IMAGE Le mappage d'image permet de définir des zones réactives dans l'image. Ces zones réactives d'une image permettent d'affecter à cette zone un hyperlien qui redirigera l'utilisateur dans une page du site ou dans un autre site. Note : Le mappage n est pas compatible avec Safari pour l instant. 1. Sélectionnez une image présente dans l éditeur. Cliquez le bouton droit de la souris et dans le menu contextuel, sélectionner Définir des zones réactives. 2a. Pour créer une zone réactive, deux méthodes s offrent à vous. La première consiste à sélectionner le type de zone (Rectangle ou Cercle) et à cliquer sur le bouton Ajouter et à redimensionner. Il est possible de créer plusieurs zones réactives sur une même image. Il suffit de cliquer à nouveau sur le bouton Ajouter.

12 156 Les éditeurs de textes Mapper une image 2b. La seconde méthode consiste à sélectionner le type de zone (Rectangle ou Cercle) et à cliquer-glisser la souris sur l image pour créer une nouvelle zone. 3. Une fois la zone réactive saisie, fournir les renseignements dans la section Propriétés de la zone sélectionnée.

13 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur 157 Gauche : Indique la position de la zone réactive à partir de la gauche, en pixel. Haut : Indique la position de la zone réactive à partir du haut, en pixel. Largeur : Indique la largeur de la zone réactive, en pixel. Hauteur : Indique la hauteur de la zone réactive, en pixel. URL : Indique l'hyperlien de la zone réactive. Destination : Détermine si le site indiqué dans le champ URL s ouvrira dans la fenêtre active du fureteur (Fenêtre) ou dans une nouvelle fenêtre (Nouvelle fenêtre). Fenêtre : Indique le code HTML de gestion de fenêtre. Info bulle : Permets d'ajouter une info bulle qui affichera le message indiqué lorsque la souris s'immobilise au-dessus de cette zone réactive. Mettre à jour : Le bouton permet la mise à jour des champs saisis. Attention! Ils ne sont pas sauvegarder dans Édu-groupe. Supprimer : Permets de supprimer la zone réactive. Supprimer tout : Permets de supprimer toutes les zones réactives saisies. 4. Il est possible de définir plusieurs zones réactives pour une image. 5. Une fois que toutes les zones réactives sont définies, cliquer sur le bouton Ok pour conserver les informations. Suivre ensuite la procédure habituelle pour enregistrer votre document.

14 158 Les éditeurs de textes Gestion des tableaux GESTION DES TABLEAUX L éditeur Édu-Notes permet d insérer un tableau de manière plus conviviale. Insérer un tableau 1. Cliquez sur l icône Insérer tableau et déterminez à l'aide de la souris le nombre de colonnes et de lignes désirées ou cliquez sur l'assistant tableau. Vous pouvez également sélectionner l'assistant de tableau.

15 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur 159 Éditer un tableau 1. Menu contextuel des tableaux Sélectionnez le tableau que vous voulez éditer et cliquez avec le bouton droit afin de faire apparaître le menu contextuel. Il vous est possible à partir du menu contextuel : D insérer des lignes ou des colonnes De supprimer des lignes ou des colonnes De combiner des cellules verticalement et horizontalement (fusionner) De diviser une cellule De régler les propriétés du tableau ou de la cellule sélectionnée D afficher ou de masquer les bordures. 2. Dans l onglet conception de tableau A. Colonnes : Cliquer sur + pour ajouter une colonne ou sur le pour enlever une colonne à la fois. B. Lignes : Cliquer sur + pour ajouter une ligne ou sur le pour enlever une ligne à la fois.

16 160 Les éditeurs de textes Gestion des tableaux C. Envergure de colonne : Cliquer sur le + pour fusionner les cellules de deux colonnes ou sur le pour diviser une cellule sur deux colonnes. D. Envergure de ligne : Cliquer sur le + pour fusionner les cellules de deux lignes ou sur le pour diviser une cellule sur deux lignes. 3. Dans l onglet propriété du tableau A. Dimensions : Permets de déterminer la largeur et la hauteur du tableau en pixels (px) ou en pourcentage (%). B. Arrière-plan : Permets de sélectionner une couleur d arrière-plan du tableau. Le X signifie qu aucune couleur d arrière-plan n est sélectionnée. C. Alignement : Permets de déterminer si l alignement du texte est à gauche, à droite, centrée ou justifiée. Le X signifie que l alignement par défaut de la page s appliquera. D. Espacement des cellules : Nombre de pixels qui sépare les lignes de chacune des cellules. E. Marge des cellules : Nombre de pixels séparant toutes les bordures de la cellule et le texte. F. Id : Permets de créer un identifiant G. Bordures : Boutons permettant de contrôler la création des lignes de bordure du tableau et des cellules. H. Épaisseur des lignes : Cliquer sur + pour augmenter l épaisseur des lignes et sur pour diminuer l épaisseur de la ligne. I. Couleur des lignes : Permets de sélectionner la couleur des lignes du tableau. Le X signifie qu aucune couleur n est sélectionnée. J. Image de fond : Permets d ajouter une image de fond dans le tableau. Pour que l image s affiche, vous devez ajouter une couleur d arrière-plan.

17 LE PORTAIL ÉDU-GROUPE Guide de l utilisateur Dans l onglet propriétés des cellules A. Sélection : Permets de sélectionner la cellule à éditer via les fonctions décrites à B, C, D, E, F. B. Alignement : Permets de déterminer si l alignement du texte est à gauche, à droite, centrée ou justifiée. C. Arrière-plan : Permets de sélectionner une couleur d arrière-plan de la cellule sélectionnée. D. Dimension : Permets de déterminer la largeur et la hauteur de la cellule sélectionnée. E. Id : Permets de créer un identifiant F. Image de fond : Permets d ajouter une image de fond de la cellule sélectionnée.

18 162 Les éditeurs de textes Gestion des tableaux 5. Dans l onglet Accessibilité A. Lignes d'entête : Permets de sélectionner le nombre de lignes qui auront une mise en forme du texte spéciale pour l'en-tête. B. Colonnes d'entête : Permets de sélectionner le nombre de colonnes qui auront une mise en forme du texte spéciale pour l'en-tête. C. Alignement du sous-titre : Permets de déterminer le type d'alignement des sous-titres. D. Sous-titre : Permets d'ajouter un sous-titre au-dessus du tableau. E. Sommaire : Permets de créer un texte de sommaire. F. Cellules associées aux entêtes : Détermine si les cellules font partie de l'en-tête.