L’outil WebI se rapproche toujours plus des utilisateurs finaux perdant ainsi l’aspect structure des mises en forme des versions précédentes pour se rapprocher d’un comportement plus proche du pack Office. Un bien fondé pour l’utilisateur occasionnel qui retrouve le traditionnel « format de cellule » mais qui rend la tâche très vite fastidieuse quand on doit fabriquer des documents en masse ou même juste quand on désire homogénéiser le look de nos entêtes de tableau, section ou cellule de corps, etc.

Utiliser une feuille de style

Un remède existe! Il s’agit d’un fichier CSS (Cascading Style Sheet) associé au document, fichier qui peut être exporté en local et qui peut être modifié à l’aide d’un simple éditeur de texte….

Ce fichier comporte un ensemble de déclarations des formats utilisés par défaut lors de la création d’un document. On peut aisément y changer les tailles des polices, images, couleurs de fonds, etc.

On retrouve dans ce fichier les zones de structure (entête,  corps et pied du document), le format des cellules de chaque zone, les descripteurs des tableaux et des champs spéciaux (nom du document, date d’exécution,…).

Pour récupérer le fichier standard CSS, il suffit d’ouvrir ou de créer un document Webi et d’aller dans propriété/  du document, cliquer sur le bouton  « Changer le style par défaut ».

Exporter le style (cela créé un fichier .css que l’on peut ouvrir avec le bloc note (ou autre éditeur de texte),

Que l’on peut modifier puis…

On peut l’appliquer (importer le style) à nos documents. Cela re-formate tous les champs de structure conformément au fichier style CSS (sauf ceux qui ont déjà été modifiés manuellement).

Présentation d’un fichier CSS

C’est un ensemble de descripteurs de formats (couleur, police, encadrement, etc) pour chaque élément qui compose un rapport WebI.

On peut, par exemple, changer les couleurs d’entête des tableaux :

• TABLE > :zone(header) > CELL {                            /*  Settings for header cells in a table  */
• font-weight-bold:yes;
• color:#AAAAAA;
• background-fill:bitmapAndColor;
• background-color:#ff0000;  /* Color used also for DHTML as basis for selection feedback interpolation */
• /* background-image: boimg://TopHeaderBlue.png; */
• border-top-color: #3877a6;
• border-right-color: #3877a6;
• border-bottom-color:#A5A5B1;
• border-left-color: #3877a6;

Chaque couleur est définie par son code Rouge Vert Bleu, code de mélange des trois couleurs primaires, mais exprimé en hexadécimal (de 00 à FF pour chaque couleur soit 6 caractères). Dans l’exemple ci-dessus j’ai mis le fond des titres en rouge après avoir mis en commentaire l’image de fond.

Description des codes couleurs, usage de l’hexadécimal

Habituellement on compte en base 10 (ça tombe bien on a 10 doigts) bien ! en hexadécimal c’est comme si on en avait 16 !

• Décimal : 0  1  2  3  4  5  6  7  8  9 puis on passe au paquet de 10 suivant (une dizaine quoi)
• Hexadécimal : 0  1  2  3  4  5  6  7  8  9  A  B  C  D  E  F puis on passe au paquet de 16 suivant

Prenons un exemple : 2C vaux 2 paquets de 16 + 12 unités soit 44.

Une couleur se définit par un chiffre entre 0 et 255 qui comme par hasard correspond au code FF.

Récupérer un code hexadécimal sans faire de calculs

Une solution simple, poser une cellule vide dans votre document WebI puis choisir « Autres couleurs » dans le menu de formatage. Un écran vous permet de jouer sur le mélange et de récupérer le code Hexadécimal correspondant. Ne reste plus qu’à le repositionner dans votre fichier CSS.

Utiliser un fichier de style

Votre fichier CSS étant modifié, vous pouvez créer vos documents standards (ou les ouvrir en modification) puis, dans propriétés du document, importer votre nouveau style…

Nota : l’administrateur du système peut aussi modifier le fichier sur le serveur pour qu’il s’applique par défaut à tous les documents.