Ajouter une table à un éditeur HTML

Ajouter et formater unexemple de table à un article de la base de connaissances à l’aide des contrôles de champ HTML.

Avant de commencer

Rôle requis : admin

Pourquoi et quand exécuter cette tâche

Dans cette tâche, vous créez et formatez un tableau dans htmlArea ou TinyMCE v6.8.3. Les tables résultantes doivent ressembler à l’une des images suivantes.

Figure 1. Exemple de tableau dans htmlArea

Figure 2. Exemple de tableau dans TinyMCE v6.8.3

Si vous entrez d’autres valeurs pour des aspects tels que la largeur, l’espacement des cellules, le remplissage des cellules, la bordure et l’alignement, la table résultante diffère des exemples donnés.

Procédure

1. Accédez à la Tout > Connaissances > Modifier et sélectionnez l’article de la base de connaissances que vous souhaitez modifier.
2. Dans le champ HTML, placez le curseur à l’emplacement où vous souhaitez ajouter la table.
3. Sélectionnez l’icône de table, sélectionnez Insérer une table, puis sélectionnez le nombre de lignes et de colonnes.
4. Edit les propriétés de la table.
   1. Placez votre curseur dans la table, sélectionnez l’icône de la table, puis sélectionnez Propriétés de la table.
   2. Entrez les valeurs suivantes dans l’onglet Général .
      • Largeur : 75 %
      • Espacement des cellules : 3
      • Remplissage des cellules : 3
      • Bordure : 1
      • Alignement : gauche
   3. Dans l’onglet Avancé , sélectionnez le champ de texte en regard de Couleur de la bordure et entrez Gris.
      La zone de sélection des couleurs devient grise pour indiquer la couleur que vous avez entrée. Vous pouvez également cocher la case et sélectionner les couleurs dans la palette.
   4. Sélectionnez OK.
5. Mettezà jour la ligne de table d’en-tête.
   1. Sélectionnez les cellules de la première ligne de tableau, sélectionnez l’icône de tableau, puis sélectionnez Ligne > Propriétés des lignes.
   2. Entrez les valeurs suivantes dans l’onglet Général .
      • Type de ligne : en-tête
      • Alignement : au centre
   3. Sous l’onglet Avancé, entrez #87cefa dans la zone de texte en regard de Couleur d’arrière-plan pour la définir sur un bleu clair.
   4. Sélectionnez OK.
6. Définissez les propriétés des cellules de la table.
   1. Sélectionnez toutes les cellules de la première colonne, à l’exception des cellules de la ligne d’en-tête.
   2. Sélectionnezl’icône de table et sélectionnez Cellule > Propriétés des cellules.
   3. Entrez les valeurs suivantes dans l’ongletGénéral :
      • Alignement H : Gauche
      • V Align : Haut
   4. Sélectionnez OK.
   5. Répétez ces étapes pour les cellules de tableau de la deuxième colonne.
7. Sdéfinit la couleur d’arrière-plan de la ligne du milieu.
   1. Placez votre curseur sur la ligne du milieu du tableau, sélectionnez l’icône du tableau, puis sélectionnez Ligne > Propriétés des lignes.
   2. Dans l’onglet Avancé, entrez Argent dans la zone de texte à côté de Couleur d’arrière-plan pour la définir sur la couleur #c0c0c0.
   3. Sélectionnez OK.
   4. Répétez cette procédure pour une ligne de table sur deux.
8. Set la largeur de la colonnes.
   1. Sélectionnez la première colonne de la table, sélectionnez l’icône de table, puis sélectionnez Cellule > Propriétés des cellules.
   2. Dans l’onglet Général , saisissez 30 % dans le champ de texte Largeur .
   3. Sélectionnez OK.
9. Sélectionnez et maintenez enfoncé (ou cliquez avec le bouton droit de la souris) l'en-tête du formulaire, puis sélectionnez Enregistrer.
10. Saisissez les données dans les cellules du tableau, puis enregistrez l’article.