10. Examen du site HTML généré

Nous allons examiner maintenant le rendu HTML de ce document ODT. On a déjà vu que le convertisseur respectait la table des matières.

Maintenant regardons la barre supérieure du site :

En [1], le nom du site défini dans [config.json] ;
En [2], l’icône qui permet de passer au mode sombre ou clair ;
En [3], l’icône qui est un lien sur le dépôt GitHub où sera exporté le site HTML. Aussi défini dans [config.json] ;
En [4], l’icône qui permet de cacher / montrer la table des matières ;

Regardons maintenant le bas de page :

C’est le bas de page défini dans le fichier [config.json].

Le contenu de la page d’accueil

Le convertisseur Gemini 3 met dans la page Accueil tout ce qui précède, dans le document ODT, le premier titre de niveau 1, de style ‘Titre 1’ donc. Si vous y mettez des images comme ci-dessus, il va les afficher. Vous pouvez donc imaginer donner une couverture à votre site comme avec un livre réel. En [1], c’est le titre principal du document. Son rendu est contrôlé par le lignes suivantes du fichier de configuration [config.json] :

  "document_title": {
    "style_names": [
      "Titre principal",
      "Title",
      "Titre",
      "P1"
    ],
    "css": "font-size: 28px; font-weight: bold; margin-bottom: 1em; line-height: 1.2; color: #2c3e50;"
  },

lignes [2-7] : la liste des styles possibles pour le titre de votre document. Quand je regarde ce document, le style LibreOffice de mon titre est ‘Titre principal’. Or le convertisseur Gemini ne le trouvait pas. Il a fait des logs des styles qu’il rencontrait et cela a affiché [P1]. C’est un gros souci avec LibreOffice : les noms affichés des styles ne correspondent pas aux noms internes utilisés par LibreOffice. Ils ne sont là que pour s’adapter à la langue de l’utilisateur. Donc lignes [2-7], seule le ligne 6 est utile ;
ligne 8 : une fois que le titre principal a été détecté, vous pouvez paramétrer son rendu. Moi je voulais une police de taille 28 (font-size: 28px;) et du gras (font-weight: bold) ;

Avec les images et le style du titre, vous pouvez faire une page d’accueil attirante.

Le titre principal de votre document n’aura peut-être pas un des styles définis aux lignes [3-6]. Pour trouver le style de votre titre principal, utilisez la ligne suivante du fichier [config.json]

1	`"debug": true`

Avec la valeur [true], le style des paragraphes qui précèdent le premier titre de niveau 1, donc les paragraphes de la page d’accueil, va être affiché lors de l’exécution du convertisseur Gemini. Ainsi pour un autre document que celui-ci, j’ai obtenu les logs suivants :

[DEBUG PRE-H1] Style='Standard (WW)' (Clean='standard (ww)') | Texte='...'
[DEBUG PRE-H1] Style='P1' (Clean='p1') | Texte='...'
[DEBUG PRE-H1] Style='P1' (Clean='p1') | Texte='...'
[DEBUG PRE-H1] Style='P1' (Clean='p1') | Texte='...'
[DEBUG PRE-H1] Style='P3' (Clean='p3') | Texte='...'
[DEBUG PRE-H1] Style='P1' (Clean='p1') | Texte='...'
[DEBUG PRE-H1] Style='P1' (Clean='p1') | Texte='...'
[DEBUG PRE-H1] Style='P1' (Clean='p1') | Texte='...'
[DEBUG PRE-H1] Style='P1' (Clean='p1') | Texte='...'
[DEBUG PRE-H1] Style='P4' (Clean='p4') | Texte='Introduction au langage PHP7 par l’exemp...'
>>> TITRE DOCUMENT DETECTÉ : Introduction au langage PHP7 par l’exemple
[DEBUG PRE-H1] Style='Standard (WW)' (Clean='standard (ww)') | Texte='...'
[DEBUG PRE-H1] Style='Standard (WW)' (Clean='standard (ww)') | Texte='...'
[DEBUG PRE-H1] Style='Standard (WW)' (Clean='standard (ww)') | Texte='...'
[DEBUG PRE-H1] Style='Standard (WW)' (Clean='standard (ww)') | Texte='...'
[DEBUG PRE-H1] Style='Standard (WW)' (Clean='standard (ww)') | Texte='...'
[DEBUG PRE-H1] Style='Standard (WW)' (Clean='standard (ww)') | Texte='...'
[DEBUG PRE-H1] Style='P5' (Clean='p5') | Texte='Serge Tahé, juillet 2019...'
[DEBUG PRE-H1] Style='P5' (Clean='p5') | Texte='...'
[DEBUG PRE-H1] Style='P6' (Clean='p6') | Texte='...'
[DEBUG PRE-H1] Style='Heading 1' (Clean='heading 1') | Texte='Introduction au langage PHP 7...'

ligne 10, le titre du document a le style ‘P4’ ;

Dans le fichier [config.json], j’ai mis les lignes suivantes :

  "document_title": {
    "style_names": [
      "P4"
    ],
    "css": "font-size: 28px; font-weight: bold; margin-bottom: 1em; line-height: 1.2; color: #2c3e50;"
  },

ligne 3, le style que je cherchais ;

C’est pour cette raison que le débogueur affiche les lignes :

1 2	`10. [DEBUG PRE-H1] Style='P4' (Clean='p4') \| Texte='Introduction au langage PHP7 par l’exemp...' 11. >>> TITRE DOCUMENT DETECTÉ : Introduction au langage PHP7 par l’exemple`

Il a rencontré le style ‘P4’ et affiche alors que le titre du document a été trouvé. Lorsque celui-ci a été trouvé, vous pouvez mettre la clé [debug] à [false] dans [config.json] :

1	`"debug": false`

Regardons maintenant le chapitre [Exemples] qui regroupe les exemples que le convertisseur Gemini sait gérer :

Les listes

Code Java

Code C#

Code Python

Code PHP

Code ECMASCRIPT 6

Code VBScript

Code HTML

Code XML

Un résultat d’exécution avec une première ligne qui ne commence pas à 1 :

Les liens

L’enrichissement de texte

Les images

Il faut noter que le convertisseur Gemini respecte les redimensionnements des images, faits dans le document ODT.

Les caractères protégés

En [1-3], les astérisques du texte ont été préservées ;
En [4], le code MarkDown a été préservé ;

Les tableaux

Ce tableau qui avait différentes sortes de contenus à été correctement rendu par le convertisseur Gemini.

C’est tout. Si votre document utilise d’autres particularités que celles évoquées précédemment, il est hautement probable que celles-ci ne seront pas prises en compte par le convertisseur Gemini. Que faire alors ? Vous pouvez faire part de votre nouvelle demande à Gemini en lui donnant le convertisseur actuel :

En [1], je joins le convertisseur de ce document ;
En [2], je fais ma nouvelle demande ;

Vous allez partir probablement pour de nombreuses itérations. Lorsqu’une version est stable, notez son numéro pour pouvoir le redonner à Gemini en cas de régression. Il est conseillé également de faire une copie de chaque version stable. Un inconvénient majeur de Gemini est qu’il régresse assez facilement. Il suffit de lui demander une nouvelle fonctionnalité pour qu’il casse le code qui marchait auparavant. D’où l’importance de noter le numéro de version des versions stables afin de pouvoir y revenir.