Des fois, le client exige que son rapport PDF soit personnalisé : il ne veut pas utiliser le design qu’Odoo propose, mais il veut le sien, parce que son entreprise a un design system précis. C’est alors qu’il demande de charger sa propre police. Par exemple, Odoo propose Lato, mais il veut que son PDF soit imprimé avec la police Lemon. Comment arriver à ce résultat ? C’est ce que je te montre dans cet article.
1. Commence par créer le module web_custom_font
Tu vas aller sur une base propre en commençant par créer le module web_custom_font.
Et le contenu du fichier manifest sera le suivant :
{
'name': 'Web custom font',
'category': 'Tools',
'description': '''
Web custom font
========================
Adding custom font in DIN 5008 PDF reports
''',
'version': '17.0.0.0.0',
'depends': [
'web',
'l10n_din5008',
],
'data': [
'report/din5008_report_extended.xml',
],
'assets': {
'web.report_assets_common': [
(
'after',
'web/static/fonts/fonts.scss',
'web_custom_font/static/fonts/fonts.scss',
),
]
},
'license': 'LGPL-3',
}
En bref, ce module va fonctionner sur Odoo 17 et va hériter des modules web et l10n_din5008. Il est important de noter que l10n_din5008 est un standard d’impression de documents en Allemagne. Tu peux en savoir plus en allant sur cet article Wikipédia.
2. Ensuite, tu vas permettre de sélectionner la police en question
Pour cela, il faut hériter du modèle res.company et ajouter dans le champ font la police en question. Dans notre cas, il s’agit de la police Lemon que tu peux trouver sur Google Fonts
from odoo import fields, models
class ResCompany(models.Model):
_inherit = 'res.company'
font = fields.Selection(selection_add=[('Lemon', 'Lemon')])
3. Demande à Odoo de récupérer la police Lemon
Tu vas juste écrire une ligne dans le fichier fonts.scss en utilisant la directive @include google-font-pair.
Cette directive utilise @mixin google-font qui a été prédéfini dans le module web pour charger la police en question. Ainsi, lorsque l’utilisateur va choisir la police Lemon, Odoo va passer le nom de cette police dans la directive.
@include google-font-pair('Lemon');
4. Enfin, tu vas simplement appliquer cette police dans le layout du document
Comme nous travaillons à partir du layout DIN5008, tu vas juste faire un héritage de la vue l10n_din5008.external_layout_din5008 et modifier son style pour qu’il charge Lemon
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<template id="external_layout_din5008_extended" inherit_id="l10n_din5008.external_layout_din5008">
<xpath expr="//div" position="attributes">
<attribute name="style">font-family: 'Lemon', serif; font-weight:400;</attribute>
</xpath>
</template>
</odoo>
Et le tour est joué.
- Installe ou mets à jour ton module, rends-toi dans les paramètres et clique sur le lien Configurer la mise en page du document.
- Choisi l’option DIN 5008 dans l’agencement et déroule le champ fonte (police) pour choisir la police Lemon.
- Ça y est, applique tes modifications. Tu peux maintenant imprimer tes rapports avec une nouvelle police.
Le code entier du module web_custom_font dont il est question dans cet article est disponible ici sur GitHub.
J’en profite pour te rappeler que Peef te propose une expérience qui met en avant ton expertise pour accéder à des opportunités en freelance. Tu peux tester la formule en créant juste un compte.
A+
