Custom Quotation PDFs

Note for customers using custom quote PDFs in versions before 2.6: ConfigBox 3 uses a single template for both quote PDF download and quote email attachment. It is no longer necessary to override each.

You can override the output of quotation PDFs in the same way as other templates (see Custom Templates and Custom CSS for reference). However, PDF generation imposes limitations on how you write your HTML and CSS. Here we put our best tips for smooth development.

  • The PDF generator library is domPDF.

  • The template for quotations works just as regular CB views and the HTML output of the template gets passed to domPDF’s rendering functions.

  • The template HTML needs to be well nested and adhere to HTML5 standards.

  • A subset of CSS directives works with domPDF. Officially CSS 2.1 works and it is best practice to code as simple as possible.

  • domPDF documentation states that CSS floats are supported, but it does not reliably. Best to use tables for layout.

  • Nested tables (<table> within a <table>) lead to rendering issues in case the content spans over multiple pages.

  • For images, set width and height dimensions. Layout flows then work reliably.

  • In case your customizations have led to a sizeable custom CSS file (say more than 2kB), consider creating a separate stylesheet for the quotation PDF for performance reasons (set the URL to that stylesheet in the <head> block of the template).

  • Since ConfigBox 2.6.26, the PDF’s header/footer coding is in a separate template file (called header_footer) for easier customization.

  • Mind that if you want to adjust page margins, set margins on the <body> tag

Location of the original template:

Location of the custom template:

The template uses output of other views

The template uses the output of other views (namely ‘record’ and ‘positions’). If you need to override the templates of these views for the quotation PDF, mind that these views are used elsewhere (admin order page, user order page, checkout page and possibly more in the future). Alternatively, invent a system that gives you different HTML for the PDF and website.