View Categories

Personnalisation avancée des modèles de documents

2 minutes

Les modèles de documents dans Kafinea permettent une personnalisation poussée grâce à l’utilisation de balises HTML et de styles CSS spécifiques.

1. Mise en page multi-colonnes #

Il est possible de diviser le contenu d’un bloc en plusieurs colonnes, ce qui est particulièrement utile pour les listes d’informations ou les sections de bas de page.

Utilisation de la balise <columns> #

Kafinea supporte la balise spécifique <columns> pour créer des mises en page multi-colonnes simples.

Attributs disponibles :

  • column-count : Nombre de colonnes souhaité.
  • column-gap : Espace entre les colonnes (en mm).

Exemple :

<columns column-count="3" column-gap="10">
    <div>Contenu de la première colonne...</div>
    <div>Contenu de la deuxième colonne...</div>
    <div>Contenu de la troisième colonne...</div>
</columns>

Utilisation des styles CSS #

Vous pouvez également utiliser les propriétés CSS standards sur des éléments <div> :

  • column-count
  • column-gap
  • column-span

Exemple :

<div style="column-count: 2; column-gap: 5mm;">
    <p>Texte qui sera automatiquement réparti sur deux colonnes...</p>
</div>

2. Polices de caractères disponibles #

En plus des polices standards, de nouvelles polices modernes sont disponibles pour vos modèles.

Liste des nouvelles polices #

  • Montserrat : Une police sans-serif géométrique, moderne et très lisible.
  • Pathway Extreme : Une police sans-serif à chasse étroite, idéale pour les mises en page denses.

Comment appliquer une police #

Pour utiliser ces polices, vous devez les déclarer dans le style CSS de votre modèle (généralement dans une balise <style> au début du document ou via l’attribut style d’un élément).

Exemple :

<style>
    body {
        font-family: 'montserrat', sans-serif;
    }
    .titre-important {
        font-family: 'pathwayextreme', sans-serif;
        font-weight: bold;
    }
</style>

Note technique : Les noms de polices à utiliser dans le CSS sont montserrat (minuscules) et pathwayextreme (minuscules, sans espace).

3. Conseils pour le rendu PDF #

Le moteur de rendu PDF (mPDF) interprète le HTML et le CSS. Pour un résultat optimal :

  • Utilisez des unités physiques comme mm ou cm pour les marges et les largeurs.
  • Privilégiez les tableaux (<table>) pour les données structurées et les grilles complexes.
  • Testez toujours votre modèle avec l’aperçu avant de le valider pour la production.