Impression et PDF

Au-delà des formats d'impression classiques, Dokos offre plusieurs fonctionnalités d'édition avancées : l'ajout de pages de couverture en première et dernière page d'un PDF, la génération de courriers formatés avec en-tête, et la personnalisation du style visuel des impressions grâce à un champ CSS dédié. Ces outils permettent de produire des documents professionnels sans sortir de Dokos.

Pages de couverture PDF

Exemple — Cabinet Veraison Le cabinet Veraison envoie ses propositions commerciales en PDF. Il a configuré une page de couverture avec le logo du cabinet et une page de quatrième de couverture avec les mentions légales. Chaque devis généré depuis Dokos inclut automatiquement ces deux pages, sans manipulation manuelle dans un éditeur PDF externe.

Un format d'impression dans Dokos peut être associé à une page de couverture en début de document et à une page de quatrième de couverture en fin de document. Chaque page de couverture est un fichier PDF préalablement téléchargé dans Dokos et configuré depuis le formulaire Page de couverture.

Une fois les pages de couverture rattachées à un format d'impression, elles s'ajoutent automatiquement à chaque génération PDF — que ce soit depuis le bouton Imprimer, lors d'un envoi par email, ou par le biais d'une automatisation.

Configuration

Courriers formatés en PDF

Exemple — Tribu SCOP L'équipe de Tribu SCOP rédige un courrier d'accompagnement pour un appel d'offres directement dans Dokos, sélectionne l'en-tête de la société et génère un PDF prêt à l'envoi en un clic, sans passer par un traitement de texte.

Dokos permet de générer un courrier en PDF à partir d'un contenu HTML et d'un en-tête de lettre existant. Le résultat est un document PDF mis en page avec les coordonnées et le logo de la société, téléchargeable immédiatement ou joint automatiquement à un document.

Cette fonctionnalité est disponible depuis les contextes qui proposent la génération de courriers — par exemple lors de l'envoi d'une communication formelle associée à un dossier.

En-têtes de lettre standard

Exemple — Maison Verte SARL Lors de l'installation de Dokos, Maison Verte SARL dispose immédiatement de trois en-têtes de lettre prêts à l'emploi. Elle peut imprimer ses factures avec l'en-tête standard dès le premier jour, sans configurer manuellement le logo ni les coordonnées.

Dokos fournit trois en-têtes de lettre standard installés automatiquement à la création de la société. Ces modèles affichent le logo, l'adresse et les coordonnées de contact de la société, et couvrent les cas d'usage les plus courants :

Chaque modèle affiche automatiquement :

• Le logo de la société (si renseigné dans la fiche Société)
• Le nom et l'adresse de la société (ou l'adresse de facturation selon le modèle)
• Les coordonnées de contact (téléphone, email…)

Utilisation par défaut

Dokos attribue automatiquement un en-tête de lettre par défaut selon le contexte :

• Documents (DocTypes) — l'en-tête standard est proposé par défaut lors de l'impression d'un document (facture, devis, bon de commande…)
• Rapports — l'en-tête rapport est proposé par défaut lors de l'impression ou de l'export d'un rapport

Ce comportement s'applique sans configuration préalable. Si votre instance existante ne disposait pas encore de ces en-têtes, une migration les crée automatiquement et définit les défauts appropriés.

      
flowchart LR
    A[Impression d'un document] --> B{Type de sortie}
    B -- Document DocType --> C[En-tête société\npar défaut]
    B -- Rapport --> D[En-tête rapport\npar défaut]
    C --> E[Logo + Adresse de facturation]
    D --> F[Logo + Coordonnées société]

    

Personnaliser ou remplacer un en-tête standard

Vous pouvez modifier un en-tête standard ou en créer un nouveau pour l'utiliser à la place :

1. Ouvrir Paramètres > Impression > En-tête de lettre.
2. Sélectionner l'en-tête à personnaliser (ex. : Company Letterhead).
3. Modifier le logo, l'adresse ou le contenu HTML selon vos besoins.
4. Pour définir un autre en-tête comme défaut pour les documents ou les rapports, cocher l'option Par défaut dans le champ correspondant et enregistrer.

CSS personnalisé sur l'en-tête de lettre

Exemple — Maison Verte SARL Maison Verte SARL souhaite que ses factures imprimées affichent le nom du client en vert et utilisent une police spécifique pour les titres. L'équipe administrative saisit directement les règles CSS dans le champ prévu sur l'en-tête de lettre, sans toucher au HTML ni faire appel à un développeur.

L'en-tête de lettre dispose d'un champ CSS personnalisé dédié. Les règles de style saisies dans ce champ sont automatiquement appliquées lors de l'impression d'un document (format d'impression) et lors de la génération de rapports associés à cet en-tête.

Ce champ remplace l'ancienne pratique qui consistait à glisser des balises <style> à l'intérieur des champs HTML de l'en-tête — une méthode qui posait des problèmes de sécurité et de maintenabilité.

Ce que vous pouvez faire

• Modifier la typographie (police, taille, couleur) des éléments de vos impressions
• Ajuster les marges, espacements et bordures
• Appliquer un style différent selon l'en-tête de lettre utilisé (ex. : une charte graphique par entité juridique)
• Cibler précisément les zones du document imprimé grâce aux sélecteurs CSS standards

Comment configurer le CSS

1. Ouvrir la liste En-tête de lettre (Letterhead) depuis Paramètres > Impression.
2. Sélectionner l'en-tête de lettre à personnaliser ou en créer un nouveau.
3. Faire défiler jusqu'à la section CSS personnalisé.
4. Saisir les règles CSS dans le champ dédié (exemple ci-dessous).
5. Enregistrer, puis générer un aperçu d'impression pour vérifier le rendu.

/* Exemple : couleur de l'en-tête de tableau et police globale */
body {
  font-family: 'Arial', sans-serif;
  font-size: 12px;
}
th {
  background-color: #2e7d32;
  color: #ffffff;
}
.print-heading {
  font-size: 18px;
  font-weight: bold;
}

Bon à savoir : le CSS saisi ici s'applique à toutes les impressions utilisant cet en-tête de lettre, qu'il s'agisse d'un document (facture, devis, bon de commande…) ou d'un rapport imprimé.

Moteurs de génération PDF

Dokos utilise un moteur de rendu pour transformer vos documents en PDF. Deux moteurs sont disponibles, avec des comportements différents en matière de mise en page, de CSS supporté et de gestion des sauts de page.

WKHTMLTOPDF (moteur historique)

WKHTMLTOPDF est le moteur historique, basé sur une version ancienne du moteur WebKit. Il est installé automatiquement avec Dokos et ne nécessite aucune configuration particulière.

Limitations connues :

• Support CSS limité : pas de CSS Grid, Flexbox partiel, pas de variables CSS
• Gestion des sauts de page parfois imprécise (coupures en milieu de paragraphe, dernière page blanche)
• Incompatible avec Bootstrap 4 ou 5

Moteur Chrome

Depuis Dokos v5, un deuxième moteur basé sur Chromium (le moteur de Google Chrome) est disponible. Il offre un rendu fidèle aux standards web actuels et résout la plupart des problèmes de mise en page rencontrés avec WKHTMLTOPDF.

Avantages :

• Support CSS complet : Grid, Flexbox moderne, variables CSS, Bootstrap 4 et 5
• Meilleure gestion des sauts de page et des paragraphes
• Rendu identique à ce que vous voyez dans le navigateur

Prérequis : Chromium (~150 Mo) est téléchargé automatiquement à l'activation.

Comparaison

Configurer le moteur de génération PDF

Le moteur peut être défini à deux niveaux :

Niveau global (s'applique à tous les formats d'impression) :

Paramètres > Paramètres d'impression > Générateur PDF

Par format d'impression (prioritaire sur le réglage global) :

Ouvrez un format d'impression > champ Générateur PDF

Les deux options proposées sont wkhtmltopdf et chrome.

Contrôle des sauts de page à l'impression

Éviter les coupures en milieu de paragraphe ou de section

Par défaut, WKHTMLTOPDF peut couper un paragraphe ou une section au milieu lorsqu'un document s'imprime sur plusieurs pages. Pour forcer un bloc à rester entier sur la même page, ajoutez des règles CSS dans le champ CSS personnalisé de votre format d'impression ou de votre en-tête de lettre :

/* Garder les sections entières sur la même page */
.section-break {
  page-break-inside: avoid;
}

/* Garder les paragraphes entiers */
p {
  page-break-inside: avoid;
}

Forcer un saut de page avant une section

Pour insérer un saut de page avant une section spécifique (ex. : avant le tableau des articles), utilisez :

.break-before {
  page-break-before: always;
}

Appliquez la classe break-before à la section concernée dans votre format d'impression.

Éviter les veuves et orphelines

Pour éviter qu'une ligne isolée ne se retrouve en haut ou en bas d'une page :

p {
  orphans: 3;
  widows: 3;
}

Exemple complet

/* Styles pour une impression professionnelle */
.section-break {
  page-break-inside: avoid;
}

.break-before {
  page-break-before: always;
}

p, ul, ol {
  page-break-inside: avoid;
  orphans: 3;
  widows: 3;
}

/* Style spécifique pour les tableaux */
table {
  page-break-inside: avoid;
}

Print Designer

Pour les entreprises souhaitant créer des formats d'impression visuels sans écrire de code HTML, l'application Print Designer propose un éditeur WYSIWYG avec glisser-déposer. Elle s'appuie sur le moteur Chrome pour le rendu.

      
flowchart TD
    A[Zone de prévisualisation] -->|Aperçu en temps réel| B[Format d'impression]
    C[Barre d'outils] -->|Ajouter des éléments| A
    D[Panneau d'inspection] -->|Modifier les propriétés| A