Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:

CRM
e-Commerce
Бухоблік
Склад
PoS
Проект
MRP

All apps

All Posts Люди Значки

Мітки (View all)

odoo accounting v14 pos v15

Про цей форум

Допомога

Adding Custom CSS to PDF Reports

css-style CSS

1 Відповісти

2284 Переглядів

Simon Landaverde

Hello,

I am trying to add custom CSS to a PDF Report that I have created. I just wanted to know the proper way of doing this. I have been able to successfully apply my CSS to the PDF report but when testing the installation of the module on a new build I get many errors during testing.

How I included my CSS in the Manifest:

'assets' : {

'web.report_assets_common' : [

'my_module/static/src/css/style.css' ,

}

Errors I get:

FAIL: TestReportsRendering.test_layout Traceback (most recent call last): File "/home/odoo/src/odoo/odoo/addons/base/tests/test_reports.py", line 367, in test_layout self.assertEqual( AssertionError: Lists differ: [['LT[82 chars]Page:', '/ 1', '1'], ['LTFigure', 'Some header[76 chars]'1']] != [['LT[82 chars]Page: 1 / 1'], ['LTFigure', 'Some header Text'[64 chars] 1']]

FAIL: TestReportsRendering.test_pdf_render_page_overflow Traceback (most recent call last): File "/home/odoo/src/odoo/odoo/addons/base/tests/test_reports.py", line 458, in test_pdf_render_page_overflow self.assertEqual(len(pages), 6, AssertionError: 4 != 6 : 6 pages are expected, 3 per record (you may ensure `nb_lines` has a correct value to generate an oveflow)

FAIL: TestReportsRendering.test_report_pdf_page_break Traceback (most recent call last): File "/home/odoo/src/odoo/odoo/addons/base/tests/test_reports.py", line 442, in test_report_pdf_page_break self.assertEqual(pages_contents, expected_pages_contents) AssertionError: Lists differ: [['LT[82 chars]Page:', '/ 2', '1'], ['LTFigure', 'Some header[306 chars]'2']] != [['LT[82 chars]Page: 1 / 2'], ['LTFigure', 'Some header Text'[282 chars] 2']]

FAIL: TestReportsRendering.test_thead_tbody_repeat Traceback (most recent call last): File "/home/odoo/src/odoo/odoo/addons/base/tests/test_reports.py", line 521, in test_thead_tbody_repeat self.assertEqual(len(pages), 6, '6 pages are expected, 3 per record (you may ensure `nb_lines` has a correct value to generate an oveflow)') AssertionError: 4 != 6 : 6 pages are expected, 3 per record (you may ensure `nb_lines` has a correct value to generate an oveflow)

These errors are only present when I have my CSS loaded in my manifest. Any guidance would be much appreciated.

Thanks,
Simon

Odiware Technologies

You're really close! The issue you're hitting is common when adding custom CSS to Odoo PDF reports via web.report_assets_common. While it works visually, it can break PDF rendering tests if the CSS introduces layout shifts, changes margins, or affects pagination.

✅ Best Practice for Custom PDF CSS in Odoo:

Instead of injecting your styles in web.report_assets_common, which affects all reports and test cases globally, you should isolate your CSS to only your specific report.

✅ Solution (Recommended Approach):

Use the report_layout asset bundle only within your report QWeb template, like this:

1. Keep CSS in your module:

plaintext

CopyEdit

my_module/static/src/css/my_report.css

2. Do NOT add it to web.report_assets_common in the manifest.

3. Instead, load it in your QWeb template like this:

xml
CopyEdit
<t t-name="my_module.my_report_template">
    <t t-call="web.html_container">
        <t t-call-assets="web.report_assets_common" t-js="false"/>
        <t t-call-assets="my_module.assets_report" t-js="false"/>

        <!-- Your report content -->
    </t>
</t>

4. Define the custom asset bundle in manifest.py:

python
CopyEdit
'assets': {
    'my_module.assets_report': [
        'my_module/static/src/css/my_report.css',
    ],
}

✅ Why This Works:

Keeps the CSS scoped only to your report.
Prevents global test failures like test_layout and test_page_break, which are sensitive to CSS overflow or layout changes.
Ensures future compatibility across Odoo versions and PDF engines like wkhtmltopdf or weasyprint.

Enjoying the discussion? Don't just read, join in!

Create an account today to enjoy exclusive features and engage with our awesome community!

Реєстрація

Related Posts	Відповіді	Переглядів
CSS Flexbox Layout Issue: Seeking Guidance for Troubleshooting CSS	0 січ. 24	1957
Getting CSS Style error while Accessing the site css-style Error	0 серп. 24	2123
How to modify dropdown "more" arrow on smart button list in odoo 14 Вирішено v14 CSS	1 лют. 23	2770
Customized CSS and JS css-style Js	1 жовт. 20	1645
local odoo 9 site broken. css? error Вирішено odoo9 css-style	1 серп. 15	5076